AngularJS নিয়ন্ত্রণকারীগুলিতে 'এই' বনাম $ স্কোপ


1026

ইন AngularJS হোমপেজে এর "তৈরি করুন সামগ্রী" বিভাগে , এই উদাহরণ রয়েছে:

controller: function($scope, $element) {
  var panes = $scope.panes = [];
  $scope.select = function(pane) {
    angular.forEach(panes, function(pane) {
      pane.selected = false;
    });
    pane.selected = true;
  }
  this.addPane = function(pane) {
    if (panes.length == 0) $scope.select(pane);
    panes.push(pane);
  }
}

selectপদ্ধতিটি কীভাবে যুক্ত করা হয়েছে তা লক্ষ্য করুন $scope, তবে addPaneপদ্ধতিটি যুক্ত করা হয়েছে this। যদি আমি এটিতে পরিবর্তন করি $scope.addPaneতবে কোডটি ব্রেক হয়ে যায়।

ডকুমেন্টেশন বলছে যে আসলে একটি পার্থক্য আছে, তবে পার্থক্যটি কী তা তা উল্লেখ করে না:

অ্যাঙ্গুলার এর পূর্ববর্তী সংস্করণ (পূর্বের 1.0 টি আরসি) আপনাকে পদ্ধতির thisসাথে আন্তরজাগরণীয়ভাবে ব্যবহারের অনুমতি দেয় $scope, তবে এটি আর হয় না। পদ্ধতি ইনসাইড সুযোগ সংজ্ঞাসমূহ thisএবং $scopeবিনিমেয় (কৌণিক টি সেট রয়েছে thisকরার $scope), কিন্তু অন্যথায় আপনার নিয়ামক কন্সট্রাকটর ভিতরে না।

অ্যাঙ্গুলারজেএস নিয়ন্ত্রণকারীগুলিতে কীভাবে thisএবং $scopeকাজ করে ?


আমি এই বিভ্রান্তিকর দেখতে। যখন একটি ভিউ একটি নিয়ামক নির্দিষ্ট করে (যেমন, এনজি-কন্ট্রোলার = '...'), তখন control নিয়ামকের সাথে যুক্ত $ স্কোপটি তার সাথে উপস্থিত হয় বলে মনে হয়, কারণ দৃশ্যটি স্কোপ বৈশিষ্ট্যগুলিতে অ্যাক্সেস করতে পারে। কিন্তু যখন কোনও নির্দেশিকা 'অন্য কোনও নিয়ামক প্রয়োজন (এবং তারপরে এটির সংযোগ ফাংশনে এটি ব্যবহার করে), তখন control অন্যান্য নিয়ামকের সাথে যুক্ত স্কোপটি এর সাথে আসে না?
রাজকোক

"পূর্ববর্তী সংস্করণ ..." সম্পর্কে কি বিভ্রান্তিকর উক্তিটি এখনই সরিয়ে দেওয়া হয়েছে? তারপরে সম্ভবত আপডেটের জায়গায় থাকবে?
দিমিত্রি জায়তসেভ

ইউনিট পরীক্ষার জন্য, আপনি যদি '$ স্কোপ' এর পরিবর্তে 'এটি' ব্যবহার করেন, আপনি বিদ্রূপিত স্কোপ দিয়ে নিয়ামকটি ইনজেক্ট করতে পারবেন না, এবং আপনি ইউনিট পরীক্ষা করতে পারবেন না testing 'এটি' ব্যবহার করা ভাল অভ্যাস বলে আমি মনে করি না।
অ্যাবেন্টান

উত্তর:


999

" অ্যাঙ্গুলারজেএস নিয়ন্ত্রণকারীগুলিতে কীভাবে thisএবং $scopeকাজ করে ?"

সংক্ষিপ্ত উত্তর :

  • this
    • যখন কন্ট্রোলার কনস্ট্রাক্টর ফাংশন বলা হয়, তখন thisতা নিয়ামক হয়।
    • যখন কোনও $scopeবস্তুতে সংজ্ঞায়িত কোনও ফাংশন বলা হয়, thisতখন "ফাংশনটি যখন ডাকা হত তখন কার্যকরভাবে সুযোগ" হয়। এটি (বা নাও হতে পারে) $scopeফাংশনটি সংজ্ঞায়িত করা হতে পারে। সুতরাং, ফাংশন ভিতরে, thisএবং $scopeপারে না একই হতে।
  • $scope
    • প্রতিটি নিয়ামকের একটি যুক্ত $scopeবস্তু থাকে।
    • একটি নিয়ামক (কনস্ট্রাক্টর) ফাংশন সম্পর্কিত সম্পর্কিত মডেল বৈশিষ্ট্য এবং ফাংশন / আচরণ সেট করার জন্য দায়ী $scope
    • এই $scopeবিষয়বস্তুতে (এবং প্যারেন্ট স্কোপ অবজেক্টস, যদি প্রোটোটাইপিকাল উত্তরাধিকার খেলায় থাকে) কেবলমাত্র এইচটিএমএল / ভিউ থেকে অ্যাক্সেসযোগ্য methods যেমন, থেকে ng-click, ফিল্টার ইত্যাদি

দীর্ঘ উত্তর :

একটি নিয়ামক ফাংশন একটি জাভাস্ক্রিপ্ট কনস্ট্রাক্টর ফাংশন। যখন কনস্ট্রাক্টর ফাংশন কার্যকর করে (উদাহরণস্বরূপ, যখন একটি ভিউ লোড হয়), this(যেমন, "ফাংশন প্রসঙ্গ") নিয়ামক অবজেক্টে সেট করা থাকে। সুতরাং "ট্যাবগুলি" কন্ট্রোলার কনস্ট্রাক্টর ফাংশনে, যখন অ্যাডপেন ফাংশন তৈরি হয়

this.addPane = function(pane) { ... }

এটি কন্ট্রোলার অবজেক্টে তৈরি করা হয়েছে, স্কোপ-এ নয়। দর্শনগুলি অ্যাডপেন ফাংশনটি দেখতে পারে না - কেবলমাত্র $ স্কোপে সংজ্ঞায়িত ফাংশনগুলিতে তাদের অ্যাক্সেস রয়েছে। অন্য কথায়, এইচটিএমএলে, এটি কাজ করবে না:

<a ng-click="addPane(newPane)">won't work</a>

"ট্যাবস" নিয়ন্ত্রক কনস্ট্রাক্টর ফাংশন কার্যকর করার পরে, আমাদের নিম্নলিখিতগুলি রয়েছে:

ট্যাব নিয়ন্ত্রক কনস্ট্রাক্টর ফাংশন পরে

ড্যাশ কালো রেখা প্রটোটাইপ ইনহেরিটেন্স ইঙ্গিত - একটি বিছিন্ন সুযোগ prototypically থেকে উত্তরাধিকারী ব্যাপ্তি । (এটি এইচটিএমএলে যে নির্দেশনার মুখোমুখি হয়েছিল তার প্রভাব থেকে প্রোটোটাইপিকভাবে উত্তরাধিকার সূত্রে আসে না))

এখন, ফলকের নির্দেশকের লিঙ্ক ফাংশনটি ট্যাব নির্দেশের সাথে যোগাযোগ করতে চায় (যার সত্যিকার অর্থে এটি কোনও উপায়ে ট্যাবগুলি বিচ্ছিন্নভাবে স্কোপকে প্রভাবিত করতে হবে)। ইভেন্টগুলি ব্যবহার করা যেতে পারে, তবে অন্য একটি প্রক্রিয়াটি হ'ল requireট্যাবগুলি নিয়ন্ত্রকের ফলকটির নির্দেশ । ( requireট্যাবগুলি $ সুযোগের দিকে ফলকের নির্দেশের কোনও ব্যবস্থা নেই বলে মনে হয় ))

সুতরাং, এটি প্রশ্নটি জাগায়: যদি আমাদের কেবলমাত্র ট্যাবস নিয়ন্ত্রকের অ্যাক্সেস থাকে তবে আমরা কীভাবে ট্যাবগুলিকে বিচ্ছিন্নভাবে $ স্কোপগুলিতে অ্যাক্সেস পাই (যা আমরা সত্যই চাই?)

ভাল, লাল বিন্দু লাইন উত্তর। অ্যাডপেন () ফাংশনটির "স্কোপ" (আমি এখানে জাভাস্ক্রিপ্টের ফাংশন স্কোপ / ক্লোজারগুলি উল্লেখ করছি) ট্যাবগুলিকে বিচ্ছিন্ন $ স্কোপটিতে অ্যাক্সেস দেয়। উদাহরণস্বরূপ, অ্যাডপেন () অ্যাডপেন () সংজ্ঞায়িত করার সময় তৈরি হওয়া একটি ক্লোজারের কারণে উপরের চিত্রের "ট্যাবস আইসোলেটসকোপ" এ অ্যাক্সেস রয়েছে। (যদি আমরা পরিবর্তে ট্যাব $ স্কোপ অবজেক্টে অ্যাডপেন () সংজ্ঞায়িত করি তবে ফলক নির্দেশিকাটির এই ফাংশনে অ্যাক্সেস থাকবে না এবং তাই এটি ট্যাবস-স্কোপের সাথে যোগাযোগ করার কোনও উপায় থাকবে না))

আপনার প্রশ্নের অন্য অংশের উত্তর দিতে how does $scope work in controllers?:

$ সুযোগে সংজ্ঞায়িত ফাংশনগুলির মধ্যে, this"সুযোগটি কার্যকর হয় যেখানে / যখন ফাংশনটি ডাকা হত"। ধরুন আমাদের নিম্নলিখিত HTML রয়েছে:

<div ng-controller="ParentCtrl">
   <a ng-click="logThisAndScope()">log "this" and $scope</a> - parent scope
   <div ng-controller="ChildCtrl">
      <a ng-click="logThisAndScope()">log "this" and $scope</a> - child scope
   </div>
</div>

এবং ParentCtrl(নিঃসঙ্গ) আছে

$scope.logThisAndScope = function() {
    console.log(this, $scope)
}

প্রথম লিঙ্কটি ক্লিক করা এটি দেখায় thisএবং $scopeতা একই রকম হয়, যেহেতু " ফাংশনটি যখন ডাকা হত তখন কার্যকারণের সুযোগ" এর সাথে যুক্ত স্কোপ ParentCtrl

দ্বিতীয় লিঙ্কে ক্লিক করা হলে প্রকাশ করবে thisএবং $scopeহয় না একই, যেহেতু " কার্যকরী সুযোগ যখন ফাংশন বলা হয় " সঙ্গে যুক্ত সুযোগ ChildCtrl। তাই এখানে, thisসেট করা হয় ChildCtrlএর $scope। পদ্ধতির অভ্যন্তরে, $scopeএখনও ParentCtrlএর। সুযোগ।

বেহালা

আমি this$ স্কোপে সংজ্ঞায়িত কোনও ফাংশনের অভ্যন্তরটি ব্যবহার না করার চেষ্টা করি , কারণ এটি বিভ্রান্তিকর হয়ে ওঠে যার ফলে $ স্কোপটি প্রভাবিত হচ্ছে, বিশেষত এনজি-রিপিট, এনজি-অন্তর্ভুক্ত, এনজি-সুইচ এবং নির্দেশনাগুলি সকলেই তাদের নিজস্ব স্কোপগুলি তৈরি করতে পারে considering


6
@ টমাকিস্কোয়ার, আমি বিশ্বাস করি যে আপনি উদ্ধৃত করা সাহসী পাঠ্যটি প্রযোজ্য যখন কন্ট্রোলার কনস্ট্রাক্টর ফাংশন বলা হয় - যেমন, যখন কন্ট্রোলার তৈরি হয় = একটি স্কোপের সাথে যুক্ত হয়। এটি পরে প্রয়োগ করা হয় না, যখন যথেচ্ছ জাভাস্ক্রিপ্ট কোডটি $ স্কোপ অবজেক্টে সংজ্ঞায়িত কোনও পদ্ধতি কল করে।
মার্ক রাজকক

79
দ্রষ্টব্য যে এখন নিয়ামককে নাম হিসাবে সরাসরি টেমপ্লেটে অ্যাডপেন () ফাংশনটি কল করা সম্ভব: "মাইক্রন্ট্রোলারকে মাইক্র্ট্রোল হিসাবে" এবং তারপরে মাইক্র্ট্রেল.এডিপিপেন ()। দেখুন docs.angularjs.org/guide/concepts#controller
ক্রিস্টোফ Augier

81
অনেক বেশি সহজাত জটিলতা।
ইনঙ্ক গুমাস

11
এটি একটি অত্যন্ত তথ্যবহুল উত্তর, কিন্তু যখন আমি ব্যবহারিক সমস্যার সাথে ফিরে এসেছি ( কীভাবে "স্কোপ। Inv আবেদন করতে হবে " 'এটি' ব্যবহার করে সংজ্ঞায়িত নিয়ামক পদ্ধতিতে প্রয়োগ করতে পারি) আমি এটিকে কার্যকর করতে পারিনি। সুতরাং এটি এখনও একটি দরকারী উত্তর হিসাবে, আমি "সহজাত জটিলতা" বিভ্রান্তির সন্ধান করছি।
ডাম্বলডেড

11
জাভাস্ক্রিপ্ট - প্রচুর দড়ি [নিজেকে ফাঁসানোর জন্য]।
অ্যালিকেলিন-কিলাকা

55

'অ্যাডপ্যান' এর জন্য যে কারণটি অর্পণ করা হয়েছে তা হ'ল <pane>নির্দেশনার কারণে ।

paneনির্দেশ করে require: '^tabs', যা একটি পিতা বা মাতা নির্দেশ থেকে ট্যাব নিয়ামক বস্তু রাখে, লিঙ্ক ফাংশন মধ্যে।

addPaneলিংক ফাংশনটি এটি দেখতে পারে thisযাতে তাই নিয়োগ করা হয় pane। তারপরে paneলিঙ্ক ফাংশনে, addPaneকেবলমাত্র tabsনিয়ন্ত্রকের সম্পত্তি এবং এটি কেবল ট্যাবসন্ট্রোলারঅবজেক্ট.এডডিপেন ane সুতরাং ফলক নির্দেশকের লিঙ্কিং ফাংশনটি ট্যাবগুলি নিয়ন্ত্রণকারী অবজেক্টটি অ্যাক্সেস করতে পারে এবং তাই অ্যাডপেন পদ্ধতিতে অ্যাক্সেস করতে পারে।

আমি আশা করি আমার ব্যাখ্যা যথেষ্ট পরিষ্কার হয়েছে .. এটি ব্যাখ্যা করা একরকম কঠিন।


3
ব্যাখ্যার জন্য ধন্যবাদ. দস্তাবেজগুলি দেখে মনে হয় যে নিয়ামকটি কেবলমাত্র একটি ফাংশন যা সুযোগ সেট করে। যদি সমস্ত ক্রিয়াটি সুযোগে ঘটে তবে নিয়ামক কেন কোনও অবজেক্টের মতো আচরণ করবেন? কেন কেবল লিঙ্কিং ফাংশনে পিতামাতার সুযোগটি পাস করবেন না? সম্পাদনা করুন: এই প্রশ্নের উত্তম বাক্যটি জানাতে, যদি নিয়ামক পদ্ধতি এবং স্কোপ পদ্ধতিগুলি উভয় একই ডেটা স্ট্রাকচারের (স্কোপ) উপর কাজ করে তবে সেগুলি কেন এক জায়গায় রাখবেন না?
আলেক্সি বোরোনাইন

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

1
আরে চিহ্নিত করুন, নির্দেশকের সুযোগটি পরিবর্তন করা আসলে সহজ easier আপনি কেবল লিঙ্ক ফাংশনটি ব্যবহার করতে পারেন jsfiddle.net/TuNyj
অ্যান্ড্রু

3
ধন্যবাদ @ অ্যান্ডি এই মজার জন্য। আপনার কৌতুকগুলিতে, নির্দেশনাটি একটি নতুন সুযোগ তৈরি করছে না, তাই আমি দেখতে পাচ্ছি যে কীভাবে লিঙ্ক ফাংশনটি নিয়ন্ত্রকের স্কোপগুলি সরাসরি এখানে অ্যাক্সেস করতে পারে (যেহেতু কেবলমাত্র একটি সুযোগ রয়েছে)। ট্যাবগুলি এবং ফলক নির্দেশাবলী বিচ্ছিন্ন স্কোপগুলি ব্যবহার করে (অর্থাত্ নতুন শিশু স্কোপগুলি তৈরি করা হয়েছে যা প্যারেন্ট স্কোপ থেকে প্রোটোটাইপিকভাবে উত্তরাধিকার সূত্রে প্রাপ্ত হয় না)। বিচ্ছিন্ন স্কোপ কেসের ক্ষেত্রে, মনে হয় একটি নিয়ামককে ('এটি' ব্যবহার করে) কোনও পদ্ধতির সংজ্ঞা দেওয়া হ'ল অন্য নির্দেশকে (অপ্রত্যক্ষভাবে) অন্য (বিচ্ছিন্ন) সুযোগে প্রবেশের অনুমতি দেওয়ার একমাত্র উপায়।
রাজকোক

27

আমি কেবল দুজনের মধ্যে পার্থক্য সম্পর্কে একটি আকর্ষণীয় আকর্ষণীয় ব্যাখ্যা পড়েছি, এবং নিয়ামকের সাথে মডেলগুলি সংযুক্ত করার জন্য ক্রমবর্ধমান পছন্দ এবং মডেলগুলিকে দৃশ্যের সাথে আবদ্ধ করার জন্য নিয়ামক ওরফে alias http://toddmotto.com/digging-into-angulars-controller-as-syntax/ নিবন্ধটি।
তিনি এটি উল্লেখ করেননি তবে নির্দেশের সংজ্ঞা দেওয়ার সময়, যদি আপনাকে একাধিক নির্দেশনার মধ্যে কিছু ভাগ করে নেওয়া প্রয়োজন এবং কোনও পরিষেবা না চান (এমন কোনও বৈধ মামলা রয়েছে যেখানে পরিষেবাগুলি ঝামেলা হয়) তবে পিতামাত্ত্বিক নির্দেশকের নিয়ামকের সাথে ডেটা সংযুক্ত করুন।

$scopeসেবা দরকারী জিনিস প্রচুর, উপলব্ধ $watchসবচেয়ে বড় হচ্ছে, কিন্তু যদি আপনি করুন, দেখুন প্রদানকারীর সাথে যুক্ত হন ডেটাতে প্রয়োজন টেমপ্লেটে প্লেইন কন্ট্রোলার এবং 'হিসাবে নিয়ামক' ব্যবহার সূক্ষ্ম এবং তর্কসাপেক্ষে বাঞ্ছনীয়।


20

আমি আপনাকে নিম্নলিখিত পোস্টটি পড়ার পরামর্শ দিচ্ছি: কৌণিক জেএস: "হিসাবে নিয়ামক" বা "$ সুযোগ"?

এটি "$ স্কোপ" এর উপরে ভেরিয়েবলগুলি প্রকাশ করতে "নিয়ন্ত্রণকারী হিসাবে" ব্যবহারের সুবিধাগুলি খুব ভালভাবে বর্ণনা করে।

আমি জানি যে আপনি পদ্ধতিগুলি সম্পর্কে উল্লেখ করেছেন এবং ভেরিয়েবলগুলি নয়, তবে আমি মনে করি যে একটি কৌশলতে লেগে থাকা এবং এটির সাথে সামঞ্জস্য থাকা ভাল।

সুতরাং আমার মতের জন্য, ভেরিয়েবল ইস্যুটি পোস্টে আলোচিত হওয়ার কারণে কেবল "কন্ট্রোলার হিসাবে" কৌশলটি ব্যবহার করা এবং এটি পদ্ধতিতে প্রয়োগ করা আরও ভাল।


16

এই কোর্সে ( https://www.codeschool.com/courses/shaping-up-with-angular-js ) তারা কীভাবে "এটি" এবং অন্যান্য অনেকগুলি জিনিস ব্যবহার করবেন তা ব্যাখ্যা করে।

যদি আপনি "এই" পদ্ধতির মাধ্যমে নিয়ামকটিতে কোনও পদ্ধতি যুক্ত করেন তবে আপনাকে নিজের সম্পত্তি বা পদ্ধতিতে নিয়ামকের নাম "ডট" দিয়ে ভিউতে কল করতে হবে।

উদাহরণস্বরূপ আপনার কন্ট্রোলারটি ভিউতে ব্যবহার করে আপনার এর মতো কোড থাকতে পারে:

    <div data-ng-controller="YourController as aliasOfYourController">

       Your first pane is {{aliasOfYourController.panes[0]}}

    </div>

6
কোর্সটি অতিক্রম করার পরে, আমি সঙ্গে সঙ্গে কোড ব্যবহার করে বিভ্রান্ত হয়ে পড়েছিলাম $scope, সুতরাং এটি উল্লেখ করার জন্য ধন্যবাদ।
ম্যাট মন্টাগ

16
এই কোর্সটি মোটেও $ সুযোগের কথা উল্লেখ করে না, তারা কেবল ব্যবহার করে asএবং thisতাই এটি কীভাবে পার্থক্যটি ব্যাখ্যা করতে সহায়তা করতে পারে?
ডাম্বলডেড

10
অ্যাঙ্গুলারের সাথে আমার প্রথম স্পর্শটি উল্লিখিত কোর্স থেকেই হয়েছিল, এবং যেমনটি $scopeকখনও উল্লেখ করা হয়নি, আমি কেবল thisনিয়ন্ত্রকদের মধ্যে ব্যবহার করতে শিখেছি । সমস্যাটি হ'ল যখন আপনি আপনার কন্ট্রোলারে প্রতিশ্রুতি রক্ষা করতে শুরু করেন তখন আপনার কাছে অনেকগুলি রেফারেন্স সমস্যা হয় thisএবং প্রতিশ্রুতি ফেরতের ফাংশনের var me = thisমধ্যে thisথেকেই মডেলটিকে রেফারেন্স করার মতো কাজগুলি শুরু করতে হয়। কারণ যে তাই, আমি এখনও খুব বিভ্রান্ত আছি এমন কোন পদ্ধতি আমাকে ব্যবহৃত হবে, $scopeবা this
ব্রুনো ফিঙ্গার

@ ব্রুনোফিংগার দুর্ভাগ্যক্রমে, আপনার প্রয়োজন হবে var me = thisবা .bind(this)যখনই আপনি প্রতিশ্রুতি করবেন বা অন্যান্য ক্লোজার-ভারী জিনিস। অ্যাঙ্গুলারের সাথে এর কোনও যোগসূত্র নেই।
ডিজিট্রি লেজারকা

1
গুরুত্বপূর্ণ বিষয়টি হ'ল এটি নিয়ামক নিজেই ng-controller="MyCtrl as MC"লাগানোর সমতুল্য $scope.MC = this- এটি মাইসিআরটিএলের একটি উদাহরণ (এটি) এর মাধ্যমে টেমপ্লেটটিতে ব্যবহারের সুযোগটি সংজ্ঞায়িত করে{{ MC.foo }}
উইলিয়াম বি

3

অ্যাঙ্গুলার এর পূর্ববর্তী সংস্করণ (পূর্বের 1.0 টি আরসি) আপনাকে $ স্কোপ পদ্ধতির সাহায্যে এটিকে আন্তঃআযোগযোগ্যভাবে ব্যবহার করার অনুমতি দেয়, তবে এটি আর হয় না। স্কোপটিতে এই এবং $ স্কোপকে সংজ্ঞায়িত পদ্ধতিগুলির অভ্যন্তরে বিনিময়যোগ্য (কৌণিক এটিকে $ সুযোগে সেট করে) তবে অন্যথায় আপনার নিয়ামক কনস্ট্রাক্টরের ভিতরে নয়।

এই আচরণটি ফিরিয়ে আনার জন্য (কেন এটি পরিবর্তন করা হয়েছিল তা কি কেউ জানেন?) আপনি যুক্ত করতে পারেন:

return angular.extend($scope, this);

আপনার কন্ট্রোলার ফাংশন শেষে (প্রদত্ত ler সুযোগটি এই নিয়ামক ফাংশনে ইনজেকশনের ব্যবস্থা করা হয়েছিল)।

আপনি যে সন্তানের সাথে বাচ্চা পেতে পারেন এমন নিয়ামক বস্তুর মাধ্যমে প্যারেন্ট স্কোপে অ্যাক্সেস করার এটির দুর্দান্ত প্রভাব রয়েছে require: '^myParentDirective'


7
এই এবং $ সুযোগটি আলাদা কেন এই নিবন্ধটি একটি ভাল ব্যাখ্যা সরবরাহ করে।
রবার্ট মার্টিন

1

$ স্কোপটির আলাদা 'এটি' থাকে তবে নিয়ামকটি এটি 'এটি' control আপনি যদি নিয়ামকের ভিতরে একটি কনসোল.লগ (এটি) রাখেন তবে এটি আপনাকে একটি বস্তু (নিয়ন্ত্রণকারী) দেয় এবং এটি.এডিপিপেন () কন্ট্রোলার অবজেক্টে অ্যাডপেন পদ্ধতি যুক্ত করে। তবে $ স্কোপের আলাদা স্কোপ রয়েছে এবং এর স্কোপের সমস্ত পদ্ধতির $ স্কোপ.মোথডনেম () দ্বারা অ্যাক্সেস করা দরকার। this.methodName()অভ্যন্তরে নিয়ামক মানে নিয়ামক বস্তুর অভ্যন্তরে মিথগুলি যুক্ত করা। $scope.functionName()এইচটিএমএল এবং ভিতরে হয়

$scope.functionName(){
    this.name="Name";
    //or
    $scope.myname="myname"//are same}

আপনার সম্পাদক এ এই কোডটি আটকান এবং দেখতে কনসোল খুলুন ...

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>this $sope vs controller</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.7/angular.min.js"></script>
    <script>
        var app=angular.module("myApp",[]);
app.controller("ctrlExample",function($scope){
          console.log("ctrl 'this'",this);
          //this(object) of controller different then $scope
          $scope.firstName="Andy";
          $scope.lastName="Bot";
          this.nickName="ABot";
          this.controllerMethod=function(){

            console.log("controllerMethod ",this);
          }
          $scope.show=function(){
              console.log("$scope 'this",this);
              //this of $scope
              $scope.message="Welcome User";
          }

        });
</script>
</head>
<body ng-app="myApp" >
<div ng-controller="ctrlExample">
       Comming From $SCOPE :{{firstName}}
       <br><br>
       Comming from $SCOPE:{{lastName}}
       <br><br>
       Should Come From Controller:{{nickName}}
       <p>
            Blank nickName is because nickName is attached to 
           'this' of controller.
       </p>

       <br><br>
       <button ng-click="controllerMethod()">Controller Method</button>

       <br><br>
       <button ng-click="show()">Show</button>
       <p>{{message}}</p>

   </div>

</body>
</html>
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.