$ पार्स, $ इंटरपोलेट और $ संकलन सेवाओं के बीच क्या अंतर है?

Question

$parse, $interpolate और $compile सेवाओं के बीच क्या अंतर है? मेरे लिए वे सभी एक ही काम करते हैं: टेम्पलेट लें और इसे टेम्पलेट-फ़ंक्शन पर संकलित करें।

Answer 1

वे उन सभी सेवाओं के उदाहरण हैं जो AngularJS दृश्य प्रतिपादन में सहायता करते हैं (हालांकि $parse और $interpolate इस डोमेन के बाहर उपयोग किया जा सकता है)। इसे समझने के लिए क्या प्रत्येक सेवा की भूमिका के एचटीएमएल के इस टुकड़े का उदाहरण लेते चलो है:

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

और गुंजाइश पर मान:

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

यहाँ इस मार्कअप को देखते हुए क्या प्रत्येक सेवा तालिका में लाता है :

• $compile - यह पूरी मार्कअप लेने के लिए और यह एक जोड़ने समारोह है कि, जब एक निश्चित दायरे के खिलाफ मार डाला अल साथ गतिशील, लाइव डोम में HTML पाठ का एक टुकड़ा हो जाएगा में बदल सकते हैं एल निर्देश (यहां: 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 मशीनरी के मूल में है और जीने डोम में (निर्देशों और प्रक्षेप भाव के साथ) एचटीएमएल तार बदल सकते हैं युक्त तार के साथ संबंध है।

Answer 2

$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' 

$ अंतर्वेशन $ गुंजाइश चर के लेखन पहुँच नहीं है के रूप में हम $ eval में है और $

$ पार्स, $ अंतर्वेशन --- पार्स> होने की जरूरत है इंजेक्शन लेकिन $ eval नियंत्रक में इंजेक्शन की जरूरत नहीं है या जहां यह

$ प्रयोग किया जाता है पार्स, $ समारोह जो किसी भी संदर्भ के खिलाफ मूल्यांकन किया जा सकता है, लेकिन $ eval हमेशा $ गुंजाइश के खिलाफ मूल्यांकन किया जाता है दे अंतर्वेशन।

$ eval और दृश्यों के पीछे $ interpolate केवल $ पार्स का उपयोग करता है।