কৌণিক জেএস: যখন আমাদের ইতিমধ্যে সুযোগের সাথে নির্দেশকের নিয়ামক ছিল তখন নির্দেশকের লিঙ্ক ফাংশনের কী দরকার?

Question

স্কোপ এবং টেম্পলেটটিতে আমার কিছু অপারেশন করা দরকার। দেখে মনে হচ্ছে যে আমি linkফাংশন বা ফাংশন উভয় ক্ষেত্রেই এটি করতে পারি controller(যেহেতু উভয়েরই সুযোগে অ্যাক্সেস রয়েছে)।

যখন আমি linkফাংশন ব্যবহার করতে হবে এবং কন্ট্রোলারটি নয় তখন এটি কখন ঘটবে?

angular.module('myApp').directive('abc', function($timeout) {
    return {
        restrict: 'EA',
        replace: true,
        transclude: true,
        scope: true,
        link: function(scope, elem, attr) { /* link function */ },
        controller: function($scope, $element) { /* controller function */ }
    };
}

এছাড়াও, আমি বুঝতে পারি যে linkএটি অ-কৌণিক বিশ্ব। সুতরাং, আমি ব্যবহার করতে পারি $watch, $digestএবং $apply।

linkফাংশনের তাত্পর্যটি কী , যখন আমরা ইতিমধ্যে নিয়ন্ত্রণকারী ছিলাম?

Comments

" এছাড়াও, আমি বুঝতে পারি যে লিঙ্কটি অ-কৌণিক জগত। তাই, আমি ব্যবহার করতে পারি $watch, $digestএবং $apply? "

— musically_ut

ভিতরে linkআমরা কোনও কৌনিক যাদু দেখতে পাই না। অর্থাত্ 2 উপায় বাইন্ডিং ইত্যাদি নেই Just

— যুগল জিন্দল

Answer 1

আমার প্রাথমিক লড়াইয়ের পরে linkএবং controllerফাংশনগুলি এবং সেগুলি সম্পর্কে বেশ কিছু পড়ার পরে, আমার মনে হয় এখন আমার উত্তর আছে।

প্রথমে বুঝতে দিন ,

সংক্ষেপে কৌনিক নির্দেশাবলী কীভাবে কাজ করে:

• আমরা একটি টেমপ্লেট দিয়ে শুরু করি (স্ট্রিং হিসাবে বা একটি স্ট্রিংতে লোড)

  var templateString = '<div my-directive>{{5 + 10}}</div>';

• এখন, এটি templateStringএকটি কৌণিক উপাদান হিসাবে আবৃত করা হয়

  var el = angular.element(templateString);

• সাথে el, এখন আমরা লিঙ্ক ফাংশনটি $compileফিরে পেতে এটি সংকলন করি ।

  var l = $compile(el)

  এখানে যা ঘটেছিল তা এখানেই

  • $compile পুরো টেম্পলেটটি নিয়ে যায় এবং এটি স্বীকৃত সমস্ত নির্দেশ সংগ্রহ করে।
  • অনুসন্ধান করা সমস্ত নির্দেশ পুনরাবৃত্তির সাথে সংকলিত হয় এবং তাদের linkকার্যাদি সংগ্রহ করা হয়।
  • তারপরে, সমস্ত linkফাংশন একটি নতুন linkফাংশনে আবৃত হয় এবং হিসাবে ফিরে আসে l।

• অবশেষে, আমরা scopeএই l(লিঙ্ক) ফাংশনে ফাংশন সরবরাহ করি যা এটি scopeএবং তাদের সম্পর্কিত উপাদানগুলির সাথে মোড়ানো লিঙ্ক ফাংশনকে আরও কার্যকর করে।

  l(scope)

• এই যোগ templateকরার জন্য একটি নতুন নোড হিসাবে DOMএবং পূজা controllerযা তার ঘড়ির যোগ সুযোগ যা DOM মধ্যে টেমপ্লেট দিয়ে ভাগ করা হয়।

সংকলন বনাম লিঙ্ক বনাম নিয়ামকের তুলনা করা :

• প্রতিটি নির্দেশিকা কেবল একবারই সংকলিত হয় এবং পুনরায় ব্যবহারের জন্য লিঙ্ক ফাংশন ধরে রাখা হয়। সুতরাং, যদি কোনও নির্দেশনার সমস্ত ক্ষেত্রে প্রযোজ্য কিছু থাকে তবে নির্দেশকের compileকার্যকারিতাটির মধ্যে সম্পাদন করা উচিত ।

• এখন, সংকলন পর আমরা আছে linkফাংশন যা যখন সংযোজনের কার্যকর টেমপ্লেট থেকে করে DOM । সুতরাং, আমরা নির্দেশের প্রতিটি উদাহরণের সাথে সুনির্দিষ্টভাবে সমস্ত কিছু সম্পাদন করি। উদাহরণস্বরূপ: ইভেন্টগুলি সংযুক্ত করা , স্কোপের উপর ভিত্তি করে টেম্পলেটটি পরিবর্তন করা ইত্যাদি

• পরিশেষে, নিয়ন্ত্রকটি লাইভ এবং প্রতিক্রিয়াশীল হওয়ার জন্য উপলব্ধ থাকার সময় নির্দেশিকাটিতে DOM(সংযুক্ত হওয়ার পরে) কাজ করে। অতএব:

  (1) লিঙ্ক সহ ভিউ [ ভি ] (অর্থাত্ টেমপ্লেট) সেট আপ করার পরে । $scopeআমাদের [হল এম ] এবং $controllerআমাদের [হল সি -এ] MVC

  (২) ঘড়িগুলি সেট আপ করে $ স্কোপের সাথে দ্বি -উপায় বাঁধাইয়ের সুবিধা নিন ।

  (3) $scopeঘড়িগুলি নিয়ামকটিতে যুক্ত হওয়ার আশা করা হয় কারণ এটি রান-টাইমের সময় টেম্পলেটটি দেখছে।

  (4) অবশেষে, controllerসম্পর্কিত নির্দেশাবলীর মধ্যে যোগাযোগ করতে সক্ষম হতে ব্যবহৃত হয়। ( myTabsউদাহরণস্বরূপ https://docs.angularjs.org/guide/directive )

  (৫) এটি সত্য যে আমরা এই সমস্ত কাজটি linkফাংশনে পাশাপাশি করতে পারতাম তবে এটি উদ্বেগের বিচ্ছেদ সম্পর্কে ।

অতএব, অবশেষে আমাদের নিম্নলিখিতটি রয়েছে যা সমস্ত টুকরো পুরোপুরি ফিট করে:

Comments

আমি এই নিবন্ধটি এখানে মৃত্যুদন্ড কার্যকর করার

— ক্রমটি

দুর্দান্ত ব্যাখ্যা। লিঙ্ক ফাংশনের আগে নিয়ামককে কল করা হবে তা উল্লেখ করতে চাই।

— jsbisht

লিঙ্কের আগে কন্ট্রোলার কার্যকর করা হয়

— রায় সোহির

এটি আমাকে উত্সাহিত করে যে স্ট্যাক ওভারফ্লো দাবি করে যে সম্পাদনাগুলি কমপক্ষে characters টি অক্ষর, সুতরাং আমাকে এই উত্তরের আসল বানানটি সংশোধন করতে দেয় না।

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

Answer 2

নিয়ামক কেন প্রয়োজন হয়

মধ্যে পার্থক্য linkএবং controllerযখন আপনি আপনার DOM মধ্যে নীড় নির্দেশনা করতে চান এবং নেস্টেড জনকে পিতা বা মাতা নির্দেশ থেকে এপিআই ফাংশন এক্সপোজ খেলার মধ্যে আসে।

দস্তাবেজগুলি থেকে :

সেরা অনুশীলন: আপনি যখন অন্য নির্দেশের জন্য কোনও এপিআই প্রকাশ করতে চান তখন নিয়ামক ব্যবহার করুন। অন্যথায় লিঙ্কটি ব্যবহার করুন।

আপনি দুটি নির্দেশনা চাই বলুন my-formএবং my-text-inputএবং যদি আপনি চান my-text-inputনির্দেশ শুধুমাত্র ভিতরে প্রদর্শিত my-formএবং কোথাও।

সেক্ষেত্রে আপনি নির্দেশটি সংজ্ঞা দেওয়ার সময় বলবেন my-text-inputযে এটির জন্যparent প্রয়োজনীয় যুক্তি ব্যবহার করে DOM উপাদান থেকে একটি নিয়ামক প্রয়োজন require: '^myForm'। এখন পিতা বা মাতা উপাদান থেকে নিয়ামক হতে হবে injectedমধ্যে linkচতুর্থ আর্গুমেন্ট হিসাবে ফাংশন, নিম্নলিখিত $scope, element, attributes। আপনি যে নিয়ামকের উপর ফাংশন কল করতে পারেন এবং পিতামাতার নির্দেশের সাথে যোগাযোগ করতে পারেন।

তদুপরি, যদি এই জাতীয় নিয়ামক না পাওয়া যায় তবে একটি ত্রুটি উত্থাপিত হবে।

কেন লিংক ব্যবহার করুন

linkযদি কারওটির উপর উপলব্ধ controllerযেহেতু এটির সংজ্ঞা দেওয়া হয় তবে ফাংশনটি ব্যবহার করার দরকার নেই । তাছাড়া, যখন উভয় সংজ্ঞায়িত এবং , এক প্রয়োজন দুটি (নামোচ্চারণের ক্রম সম্পর্কে সতর্কতা অবলম্বন করা আবশ্যক আছে সামনে মৃত্যুদন্ড কার্যকর করা হয়)।$scopecontrollerlinkcontrollercontroller

যাইহোক, কৌণিক উপায়ে রেখে , বেশিরভাগ ডিওএম ম্যানিপুলেশন এবং 2-উপায় বাইন্ডিং ব্যবহার করে $watchersসাধারণত linkফাংশনটি করা হয় যখন বাচ্চাদের জন্য API এবং $scopeম্যানিপুলেশন করা হয় controller। এটি একটি কঠোর এবং দ্রুত নিয়ম নয়, তবে এটি করার ফলে কোডটি আরও মডুলার হবে এবং উদ্বেগগুলি পৃথক করতে সহায়তা করবে (নিয়ামক directiveরাষ্ট্র বজায় রাখবে এবং linkফাংশনটি DOM+ বাইরের বাইন্ডিংগুলি বজায় রাখবে )।

Comments

দারুণ. এখন, আপনি আমাকে প্রশ্নের দ্বিতীয় অংশে সাহায্য করতে পারেন?

— যুগল জিন্দল

আমি বলতে চাইছি যেহেতু আমাদের অস্তিত্বের নিয়ামক ছিল যা অন্য নির্দেশের সাথে যোগাযোগ করার জন্য ব্যবহার করা যেতে পারে। তাহলে, কী দরকার ছিল link?

— যুগল জিন্দল

আপনার উত্তরটি কোনওভাবে প্রকৃত প্রশ্নের উত্তর দেয় না।

— যুগাল জিন্ডল

যখন আমরা একটি সংজ্ঞায়িত করি তখন কি কোনও সমস্যা হয় controller? আমি নিয়ামক সংজ্ঞায়িত করা এড়াতে কেন পুরো নতুন ফাংশনটি আবিষ্কার করতে চাইব?

— Yugal Jindle

মনে হচ্ছে যে @scalaGirl এর লিঙ্ক আর কাজ করছে না

— শুরু Minato

Answer 3

controllerফাংশন / বস্তু একটি বিমূর্ততা মডেল দেখুন-কন্ট্রোলার (MVC) প্রতিনিধিত্ব করে। যদিও এমভিসি সম্পর্কে নতুন করে লেখার কিছুই নেই, তবে এটি এখনও কৌণিকের সবচেয়ে উল্লেখযোগ্য অগ্রগতি: উদ্বেগকে ছোট ছোট টুকরো করে ভাগ করুন। এবং এটি হ'ল আর কিছুই নয়, সুতরাং আপনার যদি সেই Modelপরিবর্তনগুলি নিয়ে প্রতিক্রিয়া দেখাতে হয় তবে সেই কাজটি করার জন্য সঠিক ব্যক্তি ।ViewController

linkফাংশন সম্পর্কিত গল্পটি আলাদা, এটি এমভিসি এর পরে বিভিন্ন দৃষ্টিভঙ্গি থেকে আসে। এবং সত্যিই অপরিহার্য, একবার আমরা কোনও controller/model/view (টেম্পলেট) এর সীমানা অতিক্রম করতে চাই ।

linkফাংশনে যে পরামিতিগুলি প্রবেশ করা হয় তা দিয়ে শুরু করি :

function link(scope, element, attrs) {

• স্কোপ একটি কৌণিক স্কোপ অবজেক্ট।
• উপাদানটি হ'ল জেকলাইট-মোড়ক উপাদান যা এই নির্দেশের সাথে মেলে।
• এট্রেসরা হ'ল সাধারণ বৈশিষ্ট্যযুক্ত নাম এবং তাদের সম্পর্কিত মান সহ একটি বস্তু।

করা linkপ্রসঙ্গ মধ্যে, আমরা উল্লেখ করা উচিত যে সব নির্দেশনা এই আরম্ভের প্রক্রিয়া পদক্ষেপের মধ্য দিয়ে যাচ্ছি: কম্পাইল , লিংক । ব্র্যাড গ্রিন এবং শ্যাম শেশেদ্রির বই অ্যাঙ্গুলার জেএস থেকে একটি নির্যাস :

সংকলন পর্ব (লিঙ্কের বোন, একটি পরিষ্কার ছবি পেতে এখানে এটি উল্লেখ করুন):

এই পর্যায়ে, কৌনিকটি টেমপ্লেটে সমস্ত নিবন্ধিত নির্দেশকে সনাক্ত করতে ডিওএমের পদচারণা করে। প্রতিটি নির্দেশাবলীর জন্য, এটি পরে নির্দেশকের নিয়মের (টেমপ্লেট, প্রতিস্থাপন, প্রতিলিপি, এবং এই জাতীয়) উপর ভিত্তি করে ডিওএম রূপান্তর করে এবং উপস্থিত থাকলে সংকলন ফাংশনটি কল করে। ফলাফলটি একটি সংকলিত টেম্পলেট ফাংশন,

লিংক ফেজ :

ভিউটিকে গতিশীল করার জন্য, কৌণিকর প্রতিটি নির্দেশের জন্য একটি লিঙ্ক ফাংশন চালায়। লিঙ্ক ফাংশনগুলি সাধারণত ডিওএম বা মডেলটিতে শ্রোতাদের তৈরি করে। এই শ্রোতা দর্শন এবং মডেলটিকে সর্বদা একত্রে রাখে।

কীভাবে এটি ব্যবহার করবেন তার একটি চমৎকার উদাহরণ linkএখানে পাওয়া যাবে: কাস্টম দিকনির্দেশনা তৈরি করা । উদাহরণটি দেখুন: একটি নির্দেশিকা তৈরি করা যা ডিওএমকে ম্যানিপুলেট করে , যা পৃষ্ঠায় একটি "তারিখ-সময়" সন্নিবেশ করে, প্রতি সেকেন্ডে সতেজ হয়।

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

.directive('myCurrentTime', function($timeout, dateFilter) {

 function link(scope, element, attrs) {

 ...

 // the not MVC job must be done
 function updateTime() {
   element.text(dateFilter(new Date(), format)); // here we are manipulating the DOM
 }

 function scheduleUpdate() {
   // save the timeoutId for canceling
   timeoutId = $timeout(function() {
     updateTime(); // update DOM
     scheduleUpdate(); // schedule the next update
   }, 1000);
 }

 element.on('$destroy', function() {
   $timeout.cancel(timeoutId);
 });

 ...

Comments

আপনি তুলনা করেছেন বলে মনে হয় compilerএবং link। তারা প্রশ্ন করছে যে linkআমরা ইতিমধ্যে যখন ছিলামcontroller

— যুগাল জিন্দল

আমি আরও বিস্তারিতভাবে এমনকি নিয়ামক বর্ণনা করতে উত্তর প্রসারিত করেছি। এখন ধারণা controllerবনাম linkআরো স্পষ্ট হওয়া উচিত ...

— Radim Kohler

আমি এই ব্যাখ্যাটির জন্য নিষ্পত্তি চাইতে পারি। তবে মনে হয় এটি এক ধরণের অস্পষ্ট। এটি দুর্দান্ত হবে যদি কৌণিক দল থেকে কোনও ব্যক্তি নিজেই এটির জন্য কথা বলতে পারে, তারা কোথায় দেখছে তা প্রবর্তন করে - linkবা বা - এর কাছে controller।

— যুগল জিন্দল

এটিই আমি বুঝতে চাই যে এটিই কেবল (কখন এটি পর্যাপ্ত নয়?)। এছাড়াও, আমি কৌনিক সমস্ত সুবিধা পেয়েছি controllerএবং linkতুলনামূলকভাবে কুশ্রী। সুতরাং, কৌনিক টিমের অবশ্যই একটি বিকল্পের পরিবর্তে এটির জন্য ভাল কারণ থাকতে হবে।

— যুগল জিন্দল

প্রশ্ন: কন্ট্রোলার পর্যাপ্ত হয় না যখন? উত্তর: যখন আপনার কোনও কৌনিক অভিজ্ঞতার প্রয়োজন নেই, যেমন কোনও জিকুয়েরি প্লাগইন ব্যবহার করতে বা নথিতে উল্লিখিত জকিলিট বৈশিষ্ট্যটি ব্যবহার করতে ( ডকস.আঙ্গুলারজেস.আর / আইপি / এনজি / ফাংশন / অ্যাঙ্গুলার.ইলিমেন্ট :) তখন আপনার প্রয়োজন হবে লিঙ্ক

— হাসটেক