তাত্ক্ষণিক উত্তর :
একটি শিশু স্কোপ সাধারণত প্রোটোটাইপিকভাবে তার পিতামাতার সুযোগ থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয়, তবে সবসময় নয়। এই নিয়মের একটি ব্যতিক্রম হ'ল নির্দেশনা scope: { ... }
- এটি একটি "বিচ্ছিন্ন" সুযোগ তৈরি করে যা প্রোটোটাইপিকভাবে উত্তরাধিকারসূত্রে পায় না। এই কনস্ট্রাক্টটি প্রায়শই "পুনরায় ব্যবহারযোগ্য উপাদান" নির্দেশিকা তৈরি করার সময় ব্যবহৃত হয়।
সংক্ষিপ্তসার হিসাবে, স্কোপের উত্তরাধিকার সাধারণত সরলতর ... যতক্ষণ না আপনার সন্তানের সুযোগে দ্বি-উপায় ডেটা বাঁধাইয়ের (যেমন, ফর্ম উপাদানগুলি, এনজি-মডেল) প্রয়োজন হয়। এনজি-রিপিট, এনজি-স্যুইচ এবং এনজি-অন্তর্ভুক্ত আপনাকে সন্তানের সুযোগের ভিতরে থেকে প্যারেন্ট স্কোপে কোনও আদিম (উদাহরণস্বরূপ, সংখ্যা, স্ট্রিং, বুলিয়ান) বাঁধতে চেষ্টা করলে আপনাকে ট্রিপ করতে পারে । এটি বেশিরভাগ লোকেরা যেভাবে কাজ করে তা প্রত্যাশা করে না। সন্তানের সুযোগ তার নিজস্ব সম্পত্তি পায় যা একই নামের পিতামাতার সম্পত্তি লুকায়িত / ছায়া করে। আপনার কর্মক্ষেত্র হয়
- আপনার মডেলের জন্য পিতামাতার মধ্যে অবজেক্টগুলি সংজ্ঞায়িত করুন, তারপরে সন্তানের মধ্যে সেই বস্তুর একটি সম্পত্তি উল্লেখ করুন: প্যারেন্ট ওবজ.সোমপ্রপ
- $ প্যারেন্ট.প্যারেন্টসকোপ প্রোপার্টি ব্যবহার করুন (সর্বদা সম্ভব নয়, তবে 1. এর চেয়ে সহজ যেখানে সম্ভব)
- প্যারেন্ট স্কোপটিতে একটি ফাংশন সংজ্ঞায়িত করুন এবং এটি শিশু থেকে কল করুন (সর্বদা সম্ভব নয়)
নিউ AngularJS ডেভেলপারদের প্রায়ই যে বুঝতে পারছি না ng-repeat
, ng-switch
, ng-view
, ng-include
এবং ng-if
সব নতুন শিশু সুযোগ তৈরি করেন, যাতে সমস্যা প্রায়ই দেখায় যখন এই নির্দেশনা যুক্ত। ( সমস্যার তাত্ক্ষণিক উদাহরণের জন্য এই উদাহরণটি দেখুন ))
আদিমদের সাথে এই সমস্যাটি সর্বদা একটি ' সেরা অনুশীলন "অনুসরণ করে সহজেই এড়ানো যায় ' ' আপনার এনজি-মডেলগুলিতে - 3 মিনিটের মূল্য দেখুন। মিসকো আদি বাঁধাইয়ের বিষয়টিটি প্রদর্শন করে ng-switch
।
হচ্ছে একটি '.' আপনার মডেলগুলিতে প্রোটোটাইপাল উত্তরাধিকার কার্যকর রয়েছে তা নিশ্চিত করবে। সুতরাং, ব্যবহার করুন
<input type="text" ng-model="someObj.prop1">
<!--rather than
<input type="text" ng-model="prop1">`
-->
দীর্ঘ উত্তর :
জাভাস্ক্রিপ্ট প্রোটোটাইপাল উত্তরাধিকার
অ্যাঙ্গুলারজেএস উইকিতেও রাখা হয়েছে: https://github.com/angular/angular.js/wiki/Unders સમજ- স্কোপস
প্রোটোটাইপাল উত্তরাধিকার সম্পর্কে প্রথমে দৃ understanding় বোঝা থাকা গুরুত্বপূর্ণ, বিশেষত যদি আপনি কোনও সার্ভার-সাইড ব্যাকগ্রাউন্ড থেকে এসে থাকেন এবং আপনি ক্লাস-ical উত্তরাধিকারের সাথে আরও পরিচিত হন। সুতরাং আসুন প্রথমে পর্যালোচনা করা যাক।
ধরা যাক প্যারেন্টস্কোপের বৈশিষ্ট্যগুলি রয়েছে স্ট্রিং, আংমার্ব, আনআরে, আনজেক্ট এবং এফংশন। যদি চাইল্ডস্কোপ প্রোটোটাইপিকভাবে প্যারেন্টস্কোপের উত্তরাধিকার সূত্রে আমাদের কাছে থাকে:
(নোট করুন যে স্থানটি সংরক্ষণ করতে, আমি anArray
তিনটি পৃথক ধূসর আক্ষরিক সহ একটি নীল বস্তুর পরিবর্তে অবজেক্টটিকে তার তিনটি মান সহ একটি নীল বস্তু হিসাবে দেখাব ))
যদি আমরা সন্তানের সুযোগ থেকে প্যারেন্টস্কোপে সংজ্ঞায়িত কোনও সম্পত্তি অ্যাক্সেস করার চেষ্টা করি তবে জাভাস্ক্রিপ্ট প্রথমে সন্তানের সুযোগে সন্ধান করবে, সম্পত্তিটি খুঁজে পাবে না, পরে উত্তরাধিকার সূত্রে সুযোগ অনুসন্ধান করবে এবং সম্পত্তিটি খুঁজে পাবে। (যদি এটি প্যারেন্টস্কোপে সম্পত্তিটি না পেয়ে থাকে তবে এটি মূল প্রস্থান পর্যন্ত সমস্ত প্রোটোটাইপ চেইন অবিরত করবে)) সুতরাং, এগুলি সমস্ত সত্য:
childScope.aString === 'parent string'
childScope.anArray[1] === 20
childScope.anObject.property1 === 'parent prop1'
childScope.aFunction() === 'parent output'
ধরুন আমরা তখন এটি করি:
childScope.aString = 'child string'
প্রোটোটাইপ চেইনের সাথে পরামর্শ করা হয় না এবং চাইল্ডস্কোপে একটি নতুন স্ট্রিং সম্পত্তি যুক্ত করা হয়। এই নতুন সম্পত্তি একই নামের সাথে প্যারেন্টস্কোপের সম্পত্তিটি আড়াল করে / ছায়া দেয়। যখন আমরা নীচে এনজি-রিপিট এবং এনজি-অন্তর্ভুক্ত আলোচনা করব তখন এটি খুব গুরুত্বপূর্ণ হয়ে উঠবে।
ধরুন আমরা তখন এটি করি:
childScope.anArray[1] = '22'
childScope.anObject.property1 = 'child prop1'
প্রোটোটাইপ চেইনের সাথে পরামর্শ করা হয়েছে কারণ অবজেক্টস (anArray এবং anObject) চাইল্ডস্কোপে পাওয়া যায় নি। বস্তুগুলি প্যারেন্টস্কোপে পাওয়া যায় এবং সম্পত্তির মানগুলি মূল বস্তুগুলিতে আপডেট হয়। চাইল্ডস্কোপে কোনও নতুন বৈশিষ্ট্য যুক্ত করা হয়নি; কোন নতুন অবজেক্ট তৈরি করা হয়। (নোট করুন যে জাভাস্ক্রিপ্টে অ্যারে এবং ফাংশনগুলিও বস্তু।
ধরুন আমরা তখন এটি করি:
childScope.anArray = [100, 555]
childScope.anObject = { name: 'Mark', country: 'USA' }
প্রোটোটাইপ চেইনের সাথে পরামর্শ করা হয় না, এবং শিশু স্কোপ দুটি নতুন অবজেক্ট বৈশিষ্ট্য লাভ করে যা প্যারেন্টস্কোপ অবজেক্ট বৈশিষ্ট্যগুলিকে একই নামের সাথে গোপন / ছায়া দেয়।
takeaways:
- আমরা যদি চাইল্ডস্কোপ.প্রোপার্টিএক্স পড়ি এবং চাইল্ডস্কোপের প্রোপার্টি এক্স থাকে, তবে প্রোটোটাইপ চেইনের সাথে পরামর্শ করা হয় না।
- যদি আমরা চাইল্ডস্কোপ.প্রোপার্টিএক্স সেট করি তবে প্রোটোটাইপ চেইনের সাথে পরামর্শ করা হয় না।
একটি শেষ দৃশ্য:
delete childScope.anArray
childScope.anArray[1] === 22 // true
আমরা প্রথমে চাইল্ডস্কোপ সম্পত্তি মুছে ফেলেছি, তারপরে যখন আমরা আবার সম্পত্তিটি অ্যাক্সেস করার চেষ্টা করি তখন প্রোটোটাইপ চেইনের সাথে পরামর্শ করা হয়।
কৌণিক স্কোপ উত্তরাধিকার
প্রার্থীরা:
- নিম্নলিখিতগুলি নতুন স্কোপগুলি তৈরি করে এবং প্রোটোটাইপিকভাবে উত্তরাধিকার সূত্রে: এনজি-রিপিট, এনজি-অন্তর্ভুক্ত, এনজি-স্যুইচ, এনজি-কন্ট্রোলার, ডাইরেক্টিভ উইথ
scope: true
ডাইরেক্টিভ transclude: true
।
- নিম্নলিখিতটি একটি নতুন সুযোগ তৈরি করে যা প্রোটোটাইপিকভাবে উত্তরাধিকার সূত্রে প্রাপ্ত হয় না: সাথে নির্দেশনা
scope: { ... }
। এটি পরিবর্তে একটি "বিচ্ছিন্ন" সুযোগ তৈরি করে।
দ্রষ্টব্য, ডিফল্টরূপে, নির্দেশাবলী নতুন সুযোগ তৈরি করে না - যেমন, ডিফল্ট হয় scope: false
।
NG-অন্তর্ভুক্ত
ধরুন আমাদের নিয়ামকটিতে আমাদের রয়েছে:
$scope.myPrimitive = 50;
$scope.myObject = {aNumber: 11};
এবং আমাদের এইচটিএমএল:
<script type="text/ng-template" id="/tpl1.html">
<input ng-model="myPrimitive">
</script>
<div ng-include src="'/tpl1.html'"></div>
<script type="text/ng-template" id="/tpl2.html">
<input ng-model="myObject.aNumber">
</script>
<div ng-include src="'/tpl2.html'"></div>
প্রতিটি এনজি-অন্তর্ভুক্ত একটি নতুন শিশু সুযোগ তৈরি করে, যা মূলত অভিভাবকের সুযোগ থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয়।
প্রথম ইনপুট পাঠ্যবাক্সে টাইপ করুন ("77" বলুন) বাচ্চার সুযোগকে একটি নতুন myPrimitive
স্কোপ সম্পত্তি পাওয়া যায় যা একই নামের প্যারেন্ট স্কোপ সম্পত্তিটি আড়াল করে / ছায়া করে। এটি সম্ভবত আপনি চান / প্রত্যাশা করেন না not
দ্বিতীয় ইনপুট পাঠ্য বাক্সে টাইপ করুন ("99" বলুন) এর ফলে কোনও নতুন সন্তানের সম্পত্তি দেখা দেয় না। যেহেতু tpl2.html মডেলটিকে কোনও অবজেক্টের সম্পত্তিতে আবদ্ধ করে, প্রোটোটাইপাল উত্তরাধিকার কিক্স দেয় যখন এনজিমোডেল বস্তু মাইবজেক্টের সন্ধান করে - এটি এটি প্যারেন্ট স্কোপে খুঁজে পায়।
আমরা template পিতামাতার ব্যবহারের জন্য প্রথম টেমপ্লেটটি পুনরায় লিখতে পারি, যদি আমরা আমাদের মডেলটিকে আদিম থেকে কোনও বস্তুতে পরিবর্তন করতে না চাই:
<input ng-model="$parent.myPrimitive">
এই ইনপুট পাঠ্য বাক্সে টাইপ করুন ("22" বলুন) এর ফলে কোনও নতুন সন্তানের সম্পত্তি দেখা দেয় না। মডেলটি এখন পিতামাতার সুযোগের একটি সম্পত্তিতে আবদ্ধ (কারণ $ পিতামাতা একটি শিশু স্কোপ সম্পত্তি যা পিতামাতার সুযোগকে উল্লেখ করে)।
সমস্ত স্কোপের জন্য (প্রোটোটাইপাল বা না), কৌণিক সবসময় স্কোপ বৈশিষ্ট্যগুলি $ পিতামাতার, $$ চাইল্ডহিড এবং $$ চাইল্ড টেইলের মাধ্যমে একটি পিতামাতা-সন্তানের সম্পর্ককে (যেমন, একটি শ্রেণিবিন্যাস) সন্ধান করে। আমি সাধারণত চিত্রগুলির মধ্যে এই স্কোপ বৈশিষ্ট্যগুলি দেখাই না।
দৃশ্যের জন্য যেখানে ফর্ম উপাদানগুলি জড়িত নয়, অন্য সমাধান হ'ল আদিমটি সংশোধন করার জন্য প্যারেন্ট স্কোপের কোনও ফাংশনকে সংজ্ঞায়িত করা। তারপরে নিশ্চিত করুন যে শিশুটি সর্বদা এই ফাংশনটিকে কল করে, যা প্রোটোটাইপাল উত্তরাধিকারের কারণে সন্তানের সুযোগে উপলব্ধ। যেমন,
// in the parent scope
$scope.setMyPrimitive = function(value) {
$scope.myPrimitive = value;
}
এখানে একটি নমুনা ফিডল যা এই "প্যারেন্ট ফাংশন" পদ্ধতির ব্যবহার করে। (এই উত্তরের অংশ হিসাবে এই পোড়াটি লেখা হয়েছিল: https://stackoverflow.com/a/14104318/215945 ।)
আরও দেখুন https://stackoverflow.com/a/13782671/215945 এবং https://github.com/angular/angular.js/issues/1267 ।
NG-সুইচ
এনজি-সুইচ স্কোপ উত্তরাধিকার ঠিক এনজি-অন্তর্ভুক্তের মতো কাজ করে। সুতরাং আপনার যদি প্যারেন্ট স্কোপের কোনও আদিমকে বাধ্যতামূলক 2-উপায়ের ডেটা প্রয়োজন হয় তবে $ পিতা-মাতার ব্যবহার করুন বা মডেলটিকে একটি বস্তু হিসাবে পরিবর্তন করুন এবং তারপরে সেই বস্তুর কোনও বৈশিষ্ট্যের সাথে আবদ্ধ করুন। এটি সন্তানের স্কোপ গোপন / পিতামাতার স্কোপ বৈশিষ্ট্যের ছায়া এড়ানো এড়াবে।
এছাড়াও AngularJS দেখুন , একটি স্যুইচ-কেসের বাঁধাইয়ের সুযোগ?
NG-পুনরাবৃত্তি
এনজি-রিপিট কিছুটা আলাদাভাবে কাজ করে। ধরুন আমাদের নিয়ামকটিতে আমাদের রয়েছে:
$scope.myArrayOfPrimitives = [ 11, 22 ];
$scope.myArrayOfObjects = [{num: 101}, {num: 202}]
এবং আমাদের এইচটিএমএল:
<ul><li ng-repeat="num in myArrayOfPrimitives">
<input ng-model="num">
</li>
<ul>
<ul><li ng-repeat="obj in myArrayOfObjects">
<input ng-model="obj.num">
</li>
<ul>
প্রতিটি আইটেম / পুনরাবৃত্তির জন্য, এনজি-রিপিট একটি নতুন সুযোগ তৈরি করে, যা মূলত অভিভাবকের সুযোগ থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয়, তবে এটি আইটেমটির মান নতুন সন্তানের সুযোগে একটি নতুন সম্পত্তিতেও বরাদ্দ করে । (নতুন সম্পত্তির নাম লুপ ভেরিয়েবলের নাম)) এখানে এনজি-রিপিটের অ্যাংুলার সোর্স কোডটি আসলে কী:
childScope = scope.$new(); // child scope prototypically inherits from parent scope
...
childScope[valueIdent] = value; // creates a new childScope property
যদি আইটেমটি আদিম হয় (যেমন MyArrayOfPrimitives), মূলত একটি অনুলিপি নতুন শিশু স্কোপ সম্পত্তিকে বরাদ্দ করা হয়। চাইল্ড স্কোপ প্রোপার্টি এর মান (যেমন এনজি-মডেল ব্যবহার করে চাইল্ড স্কোপ num
) পরিবর্তন করা প্যারেন্ট স্কোপ রেফারেন্সকে অ্যারে পরিবর্তন করে না । সুতরাং উপরের প্রথম এনজি- num
রিপিটে প্রতিটি শিশুর স্কোপ এমন একটি সম্পত্তি পেয়ে যায় যা মাইআরএফ অফ প্রাইমিটাইভ অ্যারে থেকে স্বতন্ত্র:
এই এনজি-রিপিট কাজ করবে না (যেমন আপনি চান / এটি আশা করেন)। পাঠ্য বাক্সগুলিতে টাইপ করা ধূসর বাক্সগুলিতে মানগুলি পরিবর্তন করে যা কেবলমাত্র শিশু স্কোপে প্রদর্শিত হয়। আমরা যা চাই তা হ'ল ইনপুটগুলি মাইআরআরএফপ্রিমিটিভ অ্যারেগুলিকে প্রভাবিত করে, কোনও শিশু সুযোগ আদি সম্পত্তিকে নয়। এটি সম্পাদন করার জন্য, আমাদের মডেলটিকে অবজেক্টের অ্যারে হিসাবে পরিবর্তন করতে হবে।
সুতরাং, আইটেমটি যদি কোনও বস্তু হয় তবে নতুন শিশু স্কোপ সম্পত্তিটিতে মূল বস্তুর (একটি অনুলিপি নয়) একটি রেফারেন্স বরাদ্দ করা হয়েছে। চাইল্ড স্কোপ প্রোপার্টি এর মান (অর্থাত্ এনজি-মডেল ব্যবহার করে obj.num
) পরিবর্তন করা বস্তুটিকে পিতামাতার স্কোপ রেফারেন্স উল্লেখ করে does সুতরাং উপরের দ্বিতীয় এনজি-রিপিটে আমাদের রয়েছে:
(আমি এক লাইন ধূসর রঙে রঙ করেছি যাতে এটি স্পষ্ট হয় যে এটি কোথায় চলছে))
এটি প্রত্যাশার মতো কাজ করে। পাঠ্যবক্সগুলিতে টাইপ করা ধূসর বাক্সগুলিতে মানগুলি পরিবর্তন করে যা শিশু এবং পিতা বা মাতা উভয়েরই জন্য দৃশ্যমান।
আরও দেখুন NG-মডেল, NG-পুনরাবৃত্তি এবং ইনপুট সঙ্গে অসুবিধা এবং
https://stackoverflow.com/a/13782671/215945
NG-নিয়ামক
এনজি-কন্ট্রোলার ব্যবহার করে নেস্টিং কন্ট্রোলাররা সাধারণ প্রোটোটাইপাল উত্তরাধিকারে যেমন এনজি-অন্তর্ভুক্ত এবং এনজি-স্যুইচ-এর ফলস্বরূপ ফলাফল দেয় তাই একই কৌশলগুলি প্রয়োগ হয়। তবে, "স্কোপ উত্তরাধিকারের মাধ্যমে তথ্য ভাগ করে নেওয়া দু'টি নিয়ন্ত্রকের পক্ষে এটি খারাপ ফর্ম হিসাবে বিবেচিত হয়" - http://onehungrymind.com/angularjs-sticky-notes-pt-1-architecture/ এর
মধ্যে ডেটা ভাগ করার জন্য একটি পরিষেবা ব্যবহার করা উচিত পরিবর্তে নিয়ামক।
(আপনি যদি কন্ট্রোলার স্কোপের উত্তরাধিকারের মাধ্যমে সত্যিকার অর্থে ডেটা ভাগ করতে চান তবে আপনার যা করার দরকার নেই তেমন কিছু নেই child সন্তানের স্কোপটিতে প্যারেন্ট স্কোপের সমস্ত বৈশিষ্ট্যে অ্যাক্সেস থাকবে load লোডিং বা নেভিগেট করার সময় কন্ট্রোলার লোড অর্ডারও পৃথক হয় )
নির্দেশনা
- ডিফল্ট (
scope: false
) - নির্দেশিকা একটি নতুন সুযোগ তৈরি করে না, সুতরাং এখানে কোনও উত্তরাধিকার নেই। এটি সহজ, তবে বিপজ্জনক কারণ, উদাহরণস্বরূপ, কোনও দিকনির্দেশক মনে করতে পারে যে এটি সুযোগে একটি নতুন সম্পত্তি তৈরি করছে, যখন বাস্তবে এটি কোনও বিদ্যমান সম্পত্তি আঁটসাঁট করছে। পুনরায় ব্যবহারযোগ্য উপাদান হিসাবে অভিপ্রায় নির্দেশিকা লেখার জন্য এটি একটি ভাল পছন্দ নয়।
scope: true
- নির্দেশনাটি একটি নতুন বাচ্চার সুযোগ তৈরি করে যা মূলত অভিভাবকের সুযোগ থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয়। যদি একাধিক নির্দেশিকা (একই ডিওএম উপাদানটিতে) কোনও নতুন সুযোগের জন্য অনুরোধ করে তবে কেবলমাত্র একটি নতুন বাচ্চার সুযোগ তৈরি হয়। যেহেতু আমাদের "স্বাভাবিক" প্রোটোটাইপাল উত্তরাধিকার রয়েছে তাই এটি এনজি-অন্তর্ভুক্ত এবং এনজি-স্যুইচের মতো, সুতরাং প্যারেন্ট স্কোপ আদিমগুলিতে আবশ্যক 2-উপায় ডেটা এবং পিতা-মাতার স্কোপ বৈশিষ্ট্যগুলি ছাপিয়ে / ছড়িয়ে দেওয়া শিশু স্কোপ সম্পর্কে সতর্ক থাকুন।
scope: { ... }
- নির্দেশনাটি একটি নতুন বিচ্ছিন্ন / বিচ্ছিন্ন সুযোগ তৈরি করে। এটি প্রোটোটাইপিকভাবে উত্তরাধিকারসূত্রে আসে না। পুনরায় ব্যবহারযোগ্য উপাদান তৈরি করার সময় এটি সাধারণত আপনার সেরা পছন্দ, যেহেতু নির্দেশটি দুর্ঘটনাক্রমে প্যারেন্ট স্কোপটি পড়তে বা সংশোধন করতে পারে না। যাইহোক, এই জাতীয় নির্দেশাবলী প্রায়শই কয়েকটি প্যারেন্ট স্কোপ বৈশিষ্ট্য অ্যাক্সেস প্রয়োজন। অভিভাবক স্কোপ এবং বিচ্ছিন্ন সুযোগের মধ্যে দ্বি-মুখী বাঁধাই ('=' ব্যবহার করে) বা একমুখী বাঁধাই ('@' ব্যবহার করে) সেট করতে অবজেক্ট হ্যাশ ব্যবহার করা হয়। প্যারেন্ট স্কোপ এক্সপ্রেশনগুলিতে বাঁধতে 'এবং' রয়েছে। সুতরাং, এগুলি সমস্ত স্থানীয় স্কোপ বৈশিষ্ট্য তৈরি করে যা পিতামাতার সুযোগ থেকে প্রাপ্ত। নোট করুন যে অ্যাট্রিবিউটিগুলি বন্ডিং সেট আপ করতে সহায়তা করার জন্য ব্যবহৃত হয় - আপনি কেবলমাত্র বস্তুর হ্যাশগুলিতে প্যারেন্ট স্কোপ সম্পত্তির নামগুলি উল্লেখ করতে পারবেন না, আপনাকে একটি অ্যাট্রিবিউট ব্যবহার করতে হবে। উদাহরণস্বরূপ, আপনি পিতামাতার সম্পত্তি বাঁধাই করতে চাইলে এটি কাজ করবে নাparentProp
বিচ্ছিন্ন সুযোগে: <div my-directive>
এবং scope: { localProp: '@parentProp' }
। নির্দেশকটি: <div my-directive the-Parent-Prop=parentProp>
এবং এর সাথে আবদ্ধ হতে চায় এমন প্রতিটি প্যারেন্ট সম্পত্তিকে নির্দিষ্ট করতে একটি বৈশিষ্ট্য অবশ্যই ব্যবহার করতে হবে scope: { localProp: '@theParentProp' }
।
স্কোপ এর __proto__
রেফারেন্স অবজেক্টকে বিচ্ছিন্ন করুন । বিচ্ছিন্ন স্কোপের $ পিতামাতারা পিতামাতাদের স্কোপগুলি উল্লেখ করে, সুতরাং যদিও এটি বিচ্ছিন্ন এবং প্যারেন্ট স্কোপ থেকে প্রোটোটাইপিকভাবে উত্তরাধিকার সূত্রে প্রাপ্ত হয় না, এটি এখনও একটি শিশু সুযোগ।
নীচের চিত্রটির জন্য আমাদের
<my-directive interpolated="{{parentProp1}}" twowayBinding="parentProp2">
এবং
scope: { interpolatedProp: '@interpolated', twowayBindingProp: '=twowayBinding' }
এছাড়াও, ধরে নিন যে নির্দেশিকাটি এটির লিঙ্কিংয়ের কাজ করে: scope.someIsolateProp = "I'm isolated"
বিচ্ছিন্ন স্কোপগুলি সম্পর্কে আরও তথ্যের জন্য দেখুন http://onehungrymind.com/angularjs-sticky-notes-pt-2-isolated-scope/
transclude: true
- নির্দেশনাটি একটি নতুন "ট্রান্সক্লুডড" সন্তানের সুযোগ তৈরি করে, যা মূলত অভিভাবকের সুযোগ থেকে উত্তরাধিকার সূত্রে প্রাপ্ত হয়। স্থানান্তরিত এবং বিচ্ছিন্ন সুযোগ (যদি থাকে) ভাইবোন হয় - প্রতিটি সুযোগের পিতামাতার সম্পত্তি একই পিতামাতার সুযোগকে উল্লেখ করে। যখন একটি ট্রান্সকোসলেটেড এবং একটি বিচ্ছিন্ন সুযোগ উভয়ই উপস্থিত থাকে, স্কোপ সম্পত্তি বিচ্ছিন্ন করুন $$ পরের শিবলিং ট্রান্সকোলেটেড স্কোপটি উল্লেখ করবে। আমি ট্রান্সক্লোড স্কোপ সহ কোনও সূক্ষ্মতা সম্পর্কে অবগত নই।
নীচের ছবির জন্য, এই সংযোজন সহ উপরের মতো একই নির্দেশনাটি ধরে নিন:transclude: true
এই ফ্রিডেলের একটি showScope()
ফাংশন রয়েছে যা কোনও বিচ্ছিন্ন এবং ট্রান্সক্লুডড স্কোপ পরীক্ষা করতে ব্যবহার করা যেতে পারে। কম্পনের নির্দেশাবলীটি মূর্ছনায় দেখুন।
সারসংক্ষেপ
চার ধরণের স্কোপ রয়েছে:
- সাধারণ প্রোটোটাইপাল স্কোপ উত্তরাধিকার - এনজি-অন্তর্ভুক্ত, এনজি-সুইচ, এনজি-কন্ট্রোলার, নির্দেশ সহ
scope: true
- অনুলিপি / অ্যাসাইনমেন্ট সহ সাধারণ প্রোটোটাইপাল স্কোপ উত্তরাধিকার - এনজি-পুনরাবৃত্তি। এনজি-রিপিটের প্রতিটি পুনরাবৃত্তি একটি নতুন বাচ্চার সুযোগ তৈরি করে এবং সেই নতুন সন্তানের সুযোগটি সর্বদা একটি নতুন সম্পত্তি পায়।
- বিচ্ছিন্ন সুযোগ - সাথে নির্দেশ
scope: {...}
। এটি প্রোটোটাইপাল নয়, তবে '=', '@', এবং '&' বৈশিষ্ট্যের মাধ্যমে প্যারেন্ট স্কোপ বৈশিষ্ট্যগুলিতে অ্যাক্সেসের জন্য একটি ব্যবস্থা সরবরাহ করে।
- স্থানান্তরিত সুযোগ - সাথে নির্দেশক
transclude: true
। এটি এক সাধারণ প্রোটোটাইপাল স্কোপ উত্তরাধিকার, তবে এটি কোনও বিচ্ছিন্ন সুযোগের ভাইবোনও।
সমস্ত স্কোপের জন্য (প্রোটোটাইপাল বা না), কৌণিক সবসময় একটি পিতা-সন্তানের সম্পর্ককে (যেমন একটি শ্রেণিবিন্যাস), সম্পত্তি via পিতামাতার এবং $$ চাইল্ডহিড এবং $$ চাইল্ড টেইলের মাধ্যমে সন্ধান করে।
চিত্রগুলি দিয়ে তৈরি করা হয়েছিল Graphviz"* .dot" ফাইল, যা হয় GitHub । টিম ক্যাসওয়েলের " লার্নিং জাভাস্ক্রিপ্ট উইথ অবজেক্ট গ্রাফ " চিত্রগুলির জন্য গ্রাফভিজ ব্যবহারের অনুপ্রেরণা ছিল।