$ পার্স, $ ইন্টারপোলেট এবং $ সংকলন পরিষেবাগুলির মধ্যে পার্থক্য কী?


180

মধ্যে পার্থক্য কি $parse, $interpolateএবং $compileসেবা? আমার জন্য তারা সবাই একই কাজ করে: টেম্পলেট নিন এবং এটি টেমপ্লেট-ফাংশনে সংকলন করুন।

উত্তর:


464

সেগুলি সেবার সমস্ত উদাহরণ যা AngularJS ভিউ রেন্ডারিংয়ে সহায়তা করে (যদিও $parseএবং $interpolateএই ডোমেনের বাইরেও এটি ব্যবহার করা যেতে পারে)। প্রতিটি পরিষেবার ভূমিকা কী তা চিত্রিত করার জন্য আসুন এইচটিএমএলের এই অংশটির উদাহরণ নেওয়া যাক:

var imgHtml = '<img ng-src="/path/{{name}}.{{extension}}">'

এবং সুযোগের মান:

$scope.name = 'image';
$scope.extension = 'jpg';

এই মার্কআপটি দেওয়া এখানে প্রতিটি পরিষেবা টেবিলে নিয়ে আসে:

  • $compile- এটি পুরো মার্কআপটি নিতে পারে এবং এটি একটি লিঙ্কিং ফাংশনে রূপান্তর করতে পারে যা কোনও নির্দিষ্ট স্কোপের বিপরীতে কার্যকর করা হলে এইচটিএমএল পাঠ্যের একটি অংশকে গতিশীল, সমস্ত নির্দেশাবলীর সাথে লাইভ ডিওমে পরিণত করবে (এখানে ng-src:) মডেল পরিবর্তনের প্রতিক্রিয়া জানায়। এটির জন্য কেউ এটির অনুরোধ করবে: $ সংকলন করুন (imgHtml) ($ স্কোপ) এবং ফলস্বরূপ সমস্ত ডিওএম ইভেন্টের সীমানা সহ একটি ডোম উপাদান পাবেন। $compileব্যবহার করছে $interpolate(অন্যান্য বিষয় ছাড়াও) তার কাজ করার।
  • $interpolateকিভাবে এমবেড ক্ষেপক এক্সপ্রেশন, প্রাক্তন .: সঙ্গে একটি স্ট্রিং প্রক্রিয়া করতে জানে /path/{{name}}.{{extension}}। অন্য কথায় এটি বিভাজন প্রকাশের সাথে একটি স্ট্রিং নিতে পারে, একটি সুযোগ এবং এটিকে ফলাফলের পাঠ্যে পরিণত করতে পারে। কেউ $interpolationপরিষেবাটিকে খুব সাধারণ, স্ট্রিং-ভিত্তিক টেম্পলেট ভাষা হিসাবে ভাবতে পারেন । উপরের উদাহরণটি দেওয়া হিসাবে একজন এই পরিষেবাটি ব্যবহার করবে: ফলস্বরূপ স্ট্রিং $interpolate("/path/{{name}}.{{extension}}")($scope)পেতে path/image.jpg
  • $parseএকটি সুযোগের বিপরীতে $interpolateপৃথক প্রকাশ ( name, extension) মূল্যায়ন করতে ব্যবহৃত হয় । এটি উভয় ব্যবহার করা যেতে পারে পঠিত এবং সেট একটি প্রদত্ত প্রকাশের জন্য মান। উদাহরণস্বরূপ, nameএক্সপ্রেশনটি মূল্যায়নের জন্য একটিটি করবে: $parse('name')($scope)"চিত্র" মান পেতে। মানটি নির্ধারণের জন্য একটি করবে:$parse('name').assign($scope, 'image2')

এই সমস্ত পরিষেবাগুলি AngularJS এ একটি সরাসরি UI সরবরাহ করতে একসাথে কাজ করছে। তবে তারা বিভিন্ন স্তরে কাজ করে:

  • $parseশুধুমাত্র পৃথক এক্সপ্রেশন সঙ্গে সংশ্লিষ্ট করা হয় ( name, extension)। এটি একটি পঠন-লিখনের পরিষেবা।
  • $interpolateকেবলমাত্র পঠিত এবং একাধিক অভিব্যক্তি ( /path/{{name}}.{{extension}}) যুক্ত স্ট্রিংগুলির সাথে সম্পর্কিত
  • $compile AngularJS মেশিনির কেন্দ্রস্থল এবং এটিএমএল স্ট্রিংগুলি (নির্দেশিকা এবং অন্তরঙ্গকরণের অভিব্যক্তি সহ) লাইভ ডিওমে রূপান্তর করতে পারে।

11
সুন্দরভাবে ব্যাখ্যা করা হয়েছে। ভোট দিয়েছেন! :)
সর্বদা আধ্যাত্মিক

2
খুশী হলাম। আপনি দয়া করে তাদের প্রত্যেকের জন্য উদাহরণ ব্যবহার এবং ফলাফল প্রদান করতে পারেন? এটি এখনও আমার কাছে 100% পরিষ্কার নয় এবং আমি মনে করি এটি অনেক সাহায্য করবে। ধন্যবাদ!
আলেজান্দ্রো গার্সিয়া ইগলেসিয়াস

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

দুর্দান্ত ব্যাখ্যা। $interpolateঅঞ্জুলারজেএস-এ আসলে যা আছে সেখানেই আমি অনুসন্ধান করেছি এবং অবশেষে আমার একটি সংক্ষিপ্ত এবং তথ্যমূলক উত্তর পেয়ে গেল।
দামিথ

তিনটি পরিষেবা অবজেক্টকে ব্যাখ্যা করার জন্য উদাহরণটি এত কার্যকরভাবে ব্যবহৃত হয়েছে। এটি প্রাথমিকভাবে আরও সহজলভ্য করতে আমাদের আরও কৌনিক জেএসের বিভিন্ন ক্ষেত্রে এই ধরণের স্পষ্ট এবং মৌলিক ব্যাখ্যা প্রয়োজন need
কিংগুলি

3
$interpolate-->

Let us say you have two variables assigned to $scope object in the controller,

$scope.a = 2;
$scope.b = 3;

var f = $interpolate("Result is : {{a*b}}");
var result = f($scope);
console.log(result);   --->'Result is 6'

This means that $interpolate can take the string which has one or more angular expressions.

Now $parse:

var f1 = $parse("a*b");
var result1 = f1($scope);
console.log(result1);   ----> '6'

**So $interpolate has the capability to evaluate a string with angular expressions mixed up in the string against the scope to get the result**.


Another important difference between $interpolate and $parse,$eval is:

**$interpolate has the capability to work with strings containing filters along with angular expressions.**

This feature is not accessible in $eval , $parse.

console.log($interpolate("Result is : {{a*b | currency : 'USD$'}}")($scope));

---> 'Result is USD $6.00'

p ইন্টারপোলেটের $ স্কোপ ভেরিয়েবলের লেখার অ্যাক্সেস নেই যেমন আমাদের $ ইভাল এবং ars পার্সে রয়েছে

$ পার্স, $ ইন্টারপোলেট ---> ইনজেকশন লাগানো দরকার তবে নিয়ামক বা যেখানে এটি ব্যবহৃত হয় সেখানে ইনজেকশনের দরকার নেই

ars পার্স, p ইন্টারপোলেট ফাংশন দেয় যা কোনও প্রসঙ্গে বিপরীতে মূল্যায়ন করা যায় তবে always স্পেস সর্বদা $ সুযোগের বিপরীতে মূল্যায়ন করা হয়।

$ eval এবং $ পর্দার পিছনে বিভক্ত শুধুমাত্র পার্স ব্যবহার করে।


0

এখানে সুন্দর ব্যাখ্যা।

var img = img/{{name}}.{{extension}}

$parse - > (name,extension) = > vimal , .jpg
$interpolate -> use angular $parse and convert into string -> img/vimal.jpg
$compile -> can turn html string img/vimal.jpg into live DOM so new img tag will be added inside our DOM with all prototype that a img tag have.
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.