আমার কি `this` বা` $ সুযোগ ব্যবহার করা উচিত?

251

নিয়ামক কার্যকারিতা অ্যাক্সেসের জন্য দুটি প্যাটার্ন ব্যবহার করা হয়: thisএবং $scope।

আমার কোনটি ব্যবহার করা উচিত এবং কখন? আমি বুঝতে পারি thisযে কন্ট্রোলারে সেট করা হয়েছে এবং $scopeদেখার জন্য স্কোপ চেইনের একটি অবজেক্ট। তবে নতুন "নিয়ন্ত্রক হিসাবে ভার" সিনট্যাক্সের সাহায্যে আপনি সহজেই ব্যবহার করতে পারেন। সুতরাং আমি যা জিজ্ঞাসা করছি তা সর্বোত্তম এবং ভবিষ্যতের দিকনির্দেশনা কী?

উদাহরণ:

ব্যবহার this

function UserCtrl() {
  this.bye = function() { alert('....'); };
}

<body ng-controller='UserCtrl as uCtrl'>
  <button ng-click='uCtrl.bye()'>bye</button>

ব্যবহার $scope

function UserCtrl($scope) {
    $scope.bye = function () { alert('....'); };
}

<body ng-controller='UserCtrl'>
    <button ng-click='bye()'>bye</button>

আমি this.nameঅন্য জাভাস্ক্রিপ্ট ওও নিদর্শনগুলির তুলনায় ব্যক্তিগতভাবে এটিকে চোখে সহজ এবং আরও প্রাকৃতিক বলে মনে করি।

পরামর্শ দয়া করে?

angularjs

— SenseDeep
সূত্র

ব্যবহার 'এই' 2013 গুগল ইনপুট / আউটপুট হিসাবে নতুন মনে করা হয় m.youtube.com/watch?v=HCR7i5F5L8c : এছাড়াও, এই উত্তর চেক stackoverflow.com/questions/11605917/...

— AlanW

"ইউসিটিআরএল হিসাবে ইউজারসিআরটিএল" সিনট্যাক্স নতুন? আমি এটি 1.0.6 বা 1.1.4 এনজিগ কন্ট্রোলার পৃষ্ঠায় নথিভুক্ত দেখতে পাচ্ছি না।

— মার্ক রাজকক

ঠিক আছে, এটি নতুন 1.1.5 এনজিগ কন্ট্রোলার পৃষ্ঠাতে নথিভুক্ত করা হয়েছে ।

— মার্ক রাজকক

1

$ সুযোগ এবং এই জন্য সর্বোত্তম ব্যাখ্যা codetunnel.io/angularjs-controller-as-or-scope

— সাঁই

229

উভয়ের ব্যবহার আছে। প্রথম, কিছু ইতিহাস ...

$ স্কোপটি হ'ল "ক্লাসিক" কৌশল এবং "নিয়ামক হিসাবে" অনেক বেশি সাম্প্রতিক (সংস্করণ 1.2.0.0 হিসাবে আনুষ্ঠানিকভাবে এটি এর আগে অস্থির প্রাক রিলিজগুলিতে প্রদর্শিত হয়েছিল)।

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

কোনটি? এটি আপনার উপর নির্ভর করে। $ সুযোগের বাইরে আরও অনেক উদাহরণ রয়েছে, তবে "নিয়ামক হিসাবে" বাষ্পও বাছাই করছে। এক অন্য চেয়ে ভাল? এটি বিতর্কযোগ্য। আপনি কিভাবে নির্বাচন করবেন?

সান্ত্বনা

আমি "হিসাবে নিয়ামক" পছন্দ করি কারণ আমি $ স্কোপটি লুকিয়ে রাখতে এবং মধ্যস্থতাকারী কোনও অবজেক্টের মাধ্যমে সদস্যদের নিয়ামক থেকে দৃশ্যে প্রকাশ করা পছন্দ করি। এটি সেট করে * *, আমি কন্ট্রোলার থেকে দর্শন পর্যন্ত যা প্রকাশ করতে চাই ঠিক তা প্রকাশ করতে পারি। আপনি এটি $ সুযোগের সাথেও করতে পারেন, আমি কেবল এটির জন্য মানক জাভাস্ক্রিপ্ট ব্যবহার করতে পছন্দ করি। আসলে আমি এটিকে কোড করি:

var vm = this;

vm.title = 'some title';
vm.saveData = function(){ ... } ;

return vm;

এটি আমার কাছে আরও পরিশ্রুত বোধ করে এবং দৃশ্যের সামনে কী প্রকাশিত হচ্ছে তা সহজেই দেখায়। লক্ষ্য করুন যে আমি যে ভেরিয়েবলটি ফিরিয়েছি তার নাম রাখি "ভিএম", যা ভিউমডেলের জন্য দাঁড়িয়েছে। এটাই আমার কনভেনশন।

$ সুযোগ দিয়ে আমি একই জিনিসগুলি করতে পারি, তাই আমি কৌশলটি যুক্ত বা বিরক্ত করছি না।

$scope.title = 'some title';
$scope.saveData = function() { ... };

সুতরাং এটি আপনার উপর নির্ভর করে।

ইনজেকশন

$ স্কোপ সহ আমার কন্ট্রোলারে ইনজেকশন $ স্কোপ দরকার। আমাকে অন্য কোনও কারণে (যেমন $ সম্প্রচার বা ঘড়ির জন্য, যদিও আমি নিয়ামকের মধ্যে থাকা ঘড়িগুলি এড়ানোর চেষ্টা করি না) প্রয়োজন না হলে কন্ট্রোলারের সাথে এটি করার দরকার নেই।

আপডেটটি আমি এই 2 টি পছন্দ সম্পর্কে এই পোস্টটি লিখেছি: http://www.johnpapa.net/do-you-like-your-angular-controllers-with-or-without-sugar/

— জন পাপা
সূত্র

4

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

— বিয়ারস

9

ঠিক। $ সুযোগটি এখনও সেক্ষেত্রে ব্যবহৃত হয় তবে এটি পরিষেবা হিসাবে বেশি ব্যবহৃত হয়। যখন আমরা কৌণিক পরিষেবাগুলি ইনজেক্ট করি ($ স্কোপ, $ কিউ, ইত্যাদি) তারা আমাদের প্রয়োজনীয় কিছু বৈশিষ্ট্য সরবরাহ করে। $ সুযোগ আমাদের দেখতে, প্রয়োগ করতে, বার্তাগুলির পাশাপাশি ডেটা বাঁধাইয়ের অনুমতি দেয় to এবং নিয়ন্ত্রক হিসাবে হিসাবে ব্যবহার করার পরেও, $ স্কোপটি এখনও ব্যবহৃত হয়, এটি কেবল বিমূর্ত

— জন পাপা

1

var vm = this;আপনারও কি ভিউতে 'ভিএম' বলার দরকার আছে? 'ভিএম হিসাবে নিয়ামক'। তাদের কি একই হতে হবে?

— জাভিদ

2

@ জনপাপা - সাইডওয়্যাফেল টেমপ্লেটগুলি "রিটার্ন ভিএম;" না কেন কন্ট্রোলার হিসাবে ব্যবহার করার সময়?

— কেভিন

2

@ কেভিন কন্ট্রোলাররা কার্যকরভাবে একজন কর্টারের ভূমিকা পালন করে এবং ইতিমধ্যে "এটি" ফিরিয়ে দেয়।

— জন পাপা

68

$scopeAngular 2.0 এ সরানো হচ্ছে is সুতরাং, thisঅ্যাঙ্গুলার ২.০ প্রকাশের তারিখটি নিকটবর্তী হওয়ার সাথে সাথে অন্যরা অনুসরণ করতে চাইলে এমন একটি পদ্ধতিকে ব্যবহার করা হবে।

— jason328
সূত্র

40

আমার মতে জাভাস্ক্রিপ্টে 'এটি' এর নিজস্ব নিজস্ব যথেষ্ট সমস্যা রয়েছে এবং এর জন্য অন্য অর্থ / ব্যবহার যুক্ত করা ভাল ধারণা নয়।

আমি স্পষ্টতার জন্য $ সুযোগ ব্যবহার করব।

হালনাগাদ

এখন সিনট্যাক্স 'হিসেবে নিয়ামক', আলোচনা হয় এখানে । আমি অনুরাগী নই, তবে এখন এটি আরও বেশি 'অফিসিয়াল' অ্যাঙ্গুলারজেএস নির্মাণ করেছেন এটি কিছুটা মনোযোগের দাবিদার।

— রায় ট্রুইলভ
সূত্র

10

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

— রাজকোককে চিহ্নিত করুন

আবার 'ইউসিটিআরএল হিসাবে ইউজারসিআরএল', আমি সম্মত, এটি বোঝার প্রয়োজন। আমি মনে করি এটি একটি খারাপ ধারণা, বেশিরভাগ কারণেই এখানে যুক্তিযুক্ত যুক্তিগুলির জন্য: গ্রুপ. google.google.com/forum/#!topic/angular/84selECbp1I

— রায়

4

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

— এমজে

$ সুযোগ স্পষ্টত্বে কিছুই যোগ করে না। প্রকৃতপক্ষে $ সুযোগ ব্যবহার করার সময় দৃষ্টিতে কী চলছে তা জানা খুব কঠিন হতে পারে এবং আপনি স্কোপগুলি নেস্ট করেছেন। সিনট্যাক্স হিসাবে নিয়ামক এটি ব্যবহারের সাথে আরও অনেক স্পষ্টতা যুক্ত করে। দৃষ্টিতে এটি দুর্দান্ত এবং স্পষ্ট যে কোন পদ্ধতি বা সম্পত্তি থেকে কোন নিয়ামকের সুযোগ আসে।

— ddelrio1986

1

আমি @ ddelrio1986 এর সাথে একমত বুটস্ট্র্যাপ ট্যাব এবং ভের ভিএম = $ স্কোপ ব্যবহার করে আগুনের সাথে সবেমাত্র একটি সমস্যা হয়েছিল। ট্যাবগুলির নিজস্ব সুযোগ রয়েছে এবং সুতরাং আপনি এটি যেমনটি আশা করেছিলেন তেমন ব্যবহার করতে পারবেন না তবে var vm = এটি দিয়ে, জিনিসগুলি কেবল প্রত্যাশার মতোই কাজ করে।

— ব্যবহারকারী 441521

11

আমি মনে করি কন্ট্রোলার হিসাবে এটি আরও ভাল যা এটি টড মোটো দ্বারা বর্ণিত আরও সহজে বাসা বাঁধার জন্য সুযোগ দেয়:

http://toddmotto.com/digging-into-angulars-controller-as-syntax/

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

এছাড়াও আপনি যে সুযোগটি 2.0 এ চলে যাচ্ছেন তা থেকে ডিকুয়াল করতে পারেন।

— রায়ান ভাইস
সূত্র

7

কৌণিক ডকুমেন্টেশন স্পষ্টভাবে আপনাকে বলছে যে ব্যবহারের thisপ্রস্তাব দেওয়া হচ্ছে। এটি, $scopeসরানো হচ্ছে এ ছাড়াও আমার কখনই ব্যবহার না করার যথেষ্ট কারণ $scope।

— tjespe
সূত্র

4

জেসন 328 এর "$ স্কোপটি অ্যাংুলার 2.0 তে সরানো হচ্ছে" আমার কাছে ভাল কারণ বলে মনে হচ্ছে। এবং আমাকে পছন্দ করতে সাহায্য করার জন্য আরও একটি কারণ খুঁজে পেয়েছি: thisআরও পাঠযোগ্য - যখন আমি fooCtrl.barএইচটিএমএল এ দেখি , ততক্ষনে আমি কোথায় এর সংজ্ঞাটি সন্ধান করতে পারি তা জানতে পারি bar।

আপডেটগুলি: thisসমাধানে স্যুইচ করার খুব বেশি পরে নয় , আমি $scopeএমনভাবে মিস করতে শুরু করেছি যাতে কম টাইপিংয়ের প্রয়োজন হয়

— ZZY
সূত্র

2

আমি একটি সংমিশ্রণ পছন্দ।

$ স্কোপ এবং 'এটি' এর একটি সাধারণ কনসোল.লগ কিছু মক ডেটা দিয়ে এগুলি স্থাপনের পরে আপনাকে এটি দেখায়।

$ সুযোগটি একটি নিয়ামকের কভার অংশগুলির নীচে অ্যাক্সেসের অনুমতি দেয়, উদাহরণস্বরূপ:

$$ChildScope: null;
$$childHead: null;
$$childTail: null;
$$listenerCount: Object;
$$listeners: Object;
$$nextSibling: Scope;
$$prevSibling: null;
$$watchers: null;
$$watcherCount: 0;
$id: 2;
$parent: Object;
foo: 'bar';

** বৈশিষ্ট্য এবং methods সহ পদ্ধতিগুলি কৌণিক দল কর্তৃক গোলমাল করার পরামর্শ দেওয়া হয় না, তবে $ পিতামাতা এবং $ আইডি সহ দুর্দান্ত জিনিস করার জন্য নিরাপদ খেলা হতে পারে।

'এটি' দ্বিমুখী ডেটা এবং ফাংশন সংযুক্ত করে সরাসরি বিন্দুতে পৌঁছে। আপনি যা সংযুক্ত করেছেন তা কেবল আপনিই দেখতে পাবেন:

foo: 'bar';

তাহলে আমি কেন একটি সংমিশ্রণ পছন্দ করি?

ইউআই-রাউটার নেস্টেড অ্যাপ্লিকেশনগুলিতে, আমি প্রধান নিয়ামকটি অ্যাক্সেস করতে পারি, শিশু নিয়ামকের অভ্যন্তরে সর্বজনীন মান এবং ফাংশন সেট করতে এবং কল করতে পারি:

প্রধান নিয়ামক:

// Main Controller
var mainCtrl = this;
mainCtrl.foo = 'Parent at the bar';

শিশু নিয়ামক মধ্যে:

// Child Controller
var mainCtrl = $scope.$parent.mainCtrl;
var childCtrl = this;

// update the parent from within the child
childCtrl.underageDrinking = function(){
    mainCtrl.foo = 'Child at the bar';
}

// And then attach the child back to a property on the parent controller!
mainCtrl.currentCtrl = childCtrl;

এখন, আপনি সন্তানের মধ্যে থেকে পিতামাতাদের কাছ থেকে এবং সন্তানের কাছ থেকে পিতামাতার অ্যাক্সেস করতে পারেন!

— ক্রেগ ও কার্টিস
সূত্র

1

উভয়ই কাজ করে তবে আপনি যদি এমন সুযোগগুলি প্রয়োগ করেন যা সুযোগের জন্য $ সুযোগের জন্য উপযুক্ত এবং আপনি যদি নিয়ামকের জন্য নিয়ামকের পক্ষে উপযুক্ত জিনিসগুলি প্রয়োগ করেন তবে আপনার কোড বজায় রাখা সহজ হবে। "উঘ কেবল স্কোপটি ব্যবহার করে এই কন্ট্রোলারটিকে সিনট্যাক্স হিসাবে ভুলে যান" এমন লোকদের কাছে ... এটি একই কাজ করতে পারে তবে আমি অবাক হয়েছি যে কীভাবে আপনি কোনও জিনিস ট্র্যাক না হারিয়ে বিশাল অ্যাপ্লিকেশন বজায় রাখতে সক্ষম হবেন।

— নিক ম্যানিং
সূত্র