Angularjs - Data Binding in Hindi




AngularJS में डेटा बाइंडिंग मॉडल और view घटकों के बीच डेटा के automatic synchronization है डेटा बाइंडिंग को सॉफ्टवेयर के विकास और technologies के लिए उपयोग में लाया जाता है data binding एक बहुत ही उपयोगी सुविधा है यह एप्लिकेशन के दृश्य व्यवसाय और तर्क के बीच एक पुल के रूप में कार्य करता है

अधिकांश templates सिस्टम केवल एक दिशा में डेटा बाइंड करते हैं ये एक दृश्य में template और मॉडल घटकों को एक साथ मर्ज करते हैं मर्ज होने के बाद, मॉडल या दृश्य के संबंधित section में change होता है और वह दृश्य में स्वतः दिखाई नहीं देते है

यह मॉडल में reflected नहीं होते है इसका मतलब यह है कि developer को कोड लिखना पड़ता है जो view के साथ दृश्य और मॉडल के साथ दृश्य को लगातार समन्वयित करता है

डेटा बाइंडिंग दो प्रकार के होते है

  • One-Way Data Binding

  • Two-way Data Binding

One-Way Data Binding

One-Way डेटा बाइंडिंग में, दृश्य automatic रूप से अद्यतन नहीं होता है और डेटा मॉडल बदल जाता है हमको हर बार update करने के लिए कस्टम कोड लिखना पड़ता है यह एक synchronization प्रक्रियाओं नहीं है और यह एक ही तरह से डेटा को संसाधित करेगा

Two-way Data Binding

Two-Way डेटा बाइंडिंग में, डेटा मॉडल बदलते समय दृश्य automatic रूप से अपडेट होता है एनजी-मॉडल directive का उपयोग करते हुए हम Two-Way डेटा बाइंडिंग को प्राप्त कर सकते हैं यदि हम एचटीएमएल नियंत्रण में एनजी-मॉडल directive का उपयोग करते हैं, तो यह इनपुट automatic रूप से अपडेट हो जाता है और डेटा इनपुट नियंत्रण में बदल जाता है

Example Code

<!DOCTYPE html>  
<html>  
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>  
<body>  
<div ng-app="" ng-init="firstName='Ram'">  
<p>Input something in the input box:</p>  
<p>Name: <input type="text" ng-model="firstName"></p>  
<p>You wrote: {{ firstName }}</p>  
</div>  
</body>  
</html>

Example Result

Input something in the input box:

Name:

You wrote: {{ firstName }}