AngularJS নির্দেশিকা সীমাবদ্ধ একটি বনাম ই


113

আমি একটি ছোট দলে কাজ করছি, অ্যাংুলারজেএসে বিল্ডিং করছি এবং কিছু বুনিয়াদি মান এবং সর্বোত্তম অনুশীলন বজায় রাখার চেষ্টা করছি; বিশেষত প্রদত্ত আমরা কৌণিকের সাথে তুলনামূলকভাবে নতুন।

আমার প্রশ্নটি দিকনির্দেশনা সম্পর্কিত। আরও সঠিকভাবে, restrictবিকল্পগুলি।

আমাদের মধ্যে কেউ কেউ restrict: 'E'এইভাবে <my-directive></my-directive>এইচটিএমএল ব্যবহার করছে ।

অন্যরা এইচটিএমএল ব্যবহার করছে restrict: 'A'এবং করছে <div my-directive></div>

তারপরে অবশ্যই আপনি restrict: 'EA'উপরের যেকোনটি ব্যবহার এবং ব্যবহার করতে পারেন ।

এই মুহুর্তে এটি কোনও বড় বিষয় নয়, যদিও এই প্রকল্পটি যত বড় হবে ততই বড় হতে চাই আমি চাইছি যে কেউ এটিকে দেখছে সহজেই কী চলছে তা বুঝতে।

কোনও কিছুর বৈশিষ্ট্য বা উপাদানগুলি করার উপায়ের পক্ষে বা বিপরীতে আছে?

বৈশিষ্ট্যের ওপরে উপাদানটি বেছে নেওয়ার ক্ষেত্রে আমাদের জানা উচিত কি এমন কোনও সমস্যা আছে?

উত্তর:


100

ডকুমেন্টেশন অনুযায়ী :

আমি কখন একটি উপাদান বনাম একটি গুণ ব্যবহার করা উচিত? আপনি যখন টেমপ্লেটের নিয়ন্ত্রণে কোনও উপাদান তৈরি করছেন তখন একটি উপাদান ব্যবহার করুন। আপনি যখন আপনার টেমপ্লেটের অংশগুলির জন্য একটি ডোমেন-নির্দিষ্ট ভাষা তৈরি করছেন তখন এর জন্য সাধারণ ক্ষেত্রে। আপনি যখন নতুন কার্যকারিতা সহ কোনও বিদ্যমান উপাদানটি সজ্জিত করছেন তখন একটি বৈশিষ্ট্য ব্যবহার করুন।

সম্পূর্ণ উত্তরের জন্য ক্ষতি সম্পর্কে নিম্নলিখিত মন্তব্য সম্পাদনা করুন:

ধরে নিই যে আপনি একটি অ্যাপ্লিকেশন তৈরি করছেন যা ইন্টারনেট এক্সপ্লোরার <= 8 এ চলতে হবে, যার অ্যাঙ্গুলারজেএস টিম অ্যাঙ্গুলারজেএস ১.৩ থেকে সমর্থন বাদ দিয়েছে, এটি কার্যকর করার জন্য আপনাকে নিম্নলিখিত নির্দেশাবলী অনুসরণ করতে হবে: https: //docs.angularjs .org / গাইড / অর্থাত


3
আমি এই ডকগুলি উপরে এবং নীচে পড়েছি তবে এটি একটি মিস করেছি :) ধন্যবাদ।
ড্যারেন ওয়াইন রাইট

3
এই ব্যাখ্যাটি কোনও ক্ষতি এবং উপকারিতা / বিধিগুলি আবরণ করে না।
কনস্ট্যান্টিন ক্রাস

সমস্যাগুলি সম্পর্কে আমার উত্তরটিকে তত্ক্ষণাত আপডেট করেছেন। আমি উপকার / বিবেকের উল্লেখ করিনি কারণ আমি মনে করি আমরা এখানে সেরা অনুশীলনের বিষয়ে আরও বেশি কথা বলছি, বিশেষত যখন কৌণিক দল দ্বারা প্রস্তাবিত এবং ব্যাখ্যা করা হয় explained
ngasull

1
"আমি উপকার / বিবেকের বিষয়টি উল্লেখ করিনি কারণ আমি মনে করি আমরা এখানে সেরা অনুশীলনের বিষয়ে আরও বেশি কথা বলছি, বিশেষত যখন কৌণিক দল দ্বারা সুপারিশ করা হয় এবং ব্যাখ্যা করা হয়।" তাই না? :)
আলেকজান্ডার মিলস 22

169

সীমাবদ্ধতা নির্দেশক ধরণের সংজ্ঞা দেওয়ার জন্য এবং এটি A(অ্যাট্রিবিউট), C(শ্রেণি), E(উপাদান), এবং M(সহ) হতে পারে, ধরে নেওয়া যাক নির্দেশকের নামটি Doc:

প্রকার: ব্যবহার

এ = <div Doc></div>

সি = <div class="Doc"></div>

ই = <Doc data="book_data"></Doc>

এম = <!--directive:Doc -->


2
@ নিকুঞ্জের উত্তরের চেয়ে কম স্পষ্ট, তবে তাদের উত্তর দেখার পরে আমি আপনার বুঝতে পারি ...
আলেকজান্ডার মিলস

47

সীমাবদ্ধ বিকল্পটি সাধারণত সেট করা থাকে:

  • 'এ' - কেবলমাত্র নামের সাথে মেলে
  • 'ই' - কেবলমাত্র এলিমেন্টের নামের সাথে মেলে
  • 'সি' - কেবল শ্রেণীর নামের সাথে মেলে
  • 'এম' - শুধুমাত্র মন্তব্যের সাথে মেলে

এখানে ডকুমেন্টেশন লিঙ্ক


সহজ এবং পরিষ্কার
গৌরব_0093

7

আইইন 8 বাক্সের বাইরে এলিমেন্ট সমর্থিত নয় আপনি IE8 কাস্টম ট্যাগগুলি গ্রহণ করতে কিছু কাজ করতে হবে।

কোনও উপাদানটির উপর কোনও বৈশিষ্ট্য ব্যবহার করার একটি সুবিধা হ'ল আপনি একই ডম নোডে একাধিক নির্দেশনা প্রয়োগ করতে পারেন। এটি বিশেষত ফর্ম নিয়ন্ত্রণের মতো জিনিসগুলির জন্য কার্যকর যেখানে আপনি হ'ল হাইলাইট করতে, অক্ষম করতে বা লেবেল ইত্যাদিতে অতিরিক্ত বৈশিষ্ট্য যুক্ত করতে পারবেন যাতে একগুচ্ছ ট্যাগগুলিতে মোড়ানো না থাকে।


5

আমি জানি যে সমস্যাগুলির মধ্যে একটি হ'ল কাস্টম উপাদানগুলির সাথে IE সমস্যা। ডক্স থেকে উদ্ধৃত হিসাবে :

3) আপনি কি না এমন পরিবর্তে অ্যাট্রিবিউট সংস্করণ ব্যবহার যেমন (কাস্টম উপাদান ট্যাগ ব্যবহার করুন)

৪) আপনি যদি কাস্টম এলিমেন্ট ট্যাগ ব্যবহার করেন তবে আপনাকে অবশ্যই IE 8 এবং নীচে খুশি করতে এই পদক্ষেপগুলি গ্রহণ করতে হবে

<!doctype html>
  <html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">
    <head>
      <!--[if lte IE 8]>
        <script>
          document.createElement('ng-include');
          document.createElement('ng-pluralize');
          document.createElement('ng-view');

          // Optionally these for CSS
          document.createElement('ng:include');
          document.createElement('ng:pluralize');
          document.createElement('ng:view');
        </script>
      <![endif]-->
    </head>
    <body>
      ...
    </body>
  </html>

4

ফাঁদ:

  1. আপনার নিজের এইচটিএমএল উপাদান ব্যবহারের মতো যেমন <my-directive></my-directive>ওয়ার্কআরউন্ড ছাড়াই IE8 এ কাজ করবে না ( https://docs.angularjs.org/guide/ie )
  2. আপনার নিজস্ব এইচটিএমএল উপাদান ব্যবহার করা এইচটিএমএল যাচাইকরণ ব্যর্থ করে দেবে।
  3. সমান এক প্যারামিটার সহ দিকনির্দেশকগুলি এটি করতে পারে:

<div data-my-directive="ValueOfTheFirstParameter"></div>

এর পরিবর্তে:

<my-directive my-param="ValueOfTheFirstParameter"></my-directive>

আমরা কাস্টম এইচটিএমএল উপাদানগুলি ব্যবহার করব না , কারণ যদি এটি 2 টি সত্য।

তৃতীয় পক্ষের কাঠামোর দ্বারা প্রতিটি নির্দেশ দুটিভাবে লেখা যেতে পারে:

<my-directive></my-directive>

অথবা

<div data-my-directive></div>

একই কাজ করে।


1
যদি আপনি সমান 1 স্কোপ প্যারামিটারের সাথে একটি নির্দেশিকা তৈরি করতে চান তবে এটি এ এর ​​সাথে করা আরও সহজ কারণ আপনাকে একটি অতিরিক্ত বৈশিষ্ট্য তৈরি করতে হবে না।
কনস্ট্যান্টিন ক্রাস

অতিরিক্ত বলতে কী বোঝ? উভয় বিকল্পের ঠিক একটি বৈশিষ্ট্য রয়েছে one
একটি ভাল অলিভার

3

উপাদানগুলির সাথে 2 সমস্যা:

  1. পুরানো ব্রাউজারগুলির সাথে খারাপ সমর্থন।
  2. এসইও - গুগলের ইঞ্জিন তাদের পছন্দ করে না।

বৈশিষ্ট্যগুলি ব্যবহার করুন।


উপাদান হিসাবে নির্দেশাবলী এসইও সমস্যা হতে পারে? আমি বিস্মিত. এবং replaceবৈশিষ্ট্য সম্পর্কে কি true?
চলসার

1
এই দাবির রেফারেন্স দরকার। পয়েন্ট 1 অন্য কোথাও সুষ্ঠুভাবে প্রতিষ্ঠিত তবে আমি পয়েন্ট ২ সম্পর্কে উত্সগুলি দেখতে পছন্দ করব
রিনোগো
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.