knockout.js
AngularJS बाइंडिंग के समकक्ष

टिप्पणियों

ngShow

किसी तत्व को गतिशील रूप से दिखाने / छिपाने के लिए AngularJS कोड:

<p ng-show="SomeScopeProperty">This is conditionally shown.</p>

नॉकआउटJS समतुल्य:

<p data-bind="visible: SomeScopeObservable">This is conditionally shown.</p>

ngBind (घुंघराले मार्कअप)

सादे पाठ के प्रतिपादन के लिए कोणीयरिज कोड:

<p>{{ ScopePropertyX }} and {{ ScopePropertyY }}</p>

नॉकआउटJS समतुल्य:

<p>
  <!-- ko text: ScopeObservableX --><!-- /ko --> 
  and 
  <!-- ko text: ScopeObservableY --><!-- /ko --> 
</p>

या:

<p>
  <span data-bind="text: ScopeObservableX"></span> 
  and 
  <span data-bind="text: ScopeObservableY"></span>
</p>

इनपुट पर ngModel [प्रकार = पाठ]

टेक्स्ट input पर दो-तरफ़ा बाइंडिंग के लिए AngularJS कोड:

<input ng-model="ScopePropertyX" type="text" />

नॉकआउटJS समतुल्य:

<input data-bind="textInput: ScopeObservableX" type="text" />

ngHide

नॉकआउट जेएस में कोई प्रत्यक्ष समकक्ष बाध्यकारी नहीं है। हालाँकि, छिपाना केवल दिखाने के विपरीत है, हम नॉकआउट के ngShow समकक्ष के लिए उदाहरण को उल्टा कर सकते हैं।

<p ng-hide="SomeScopeProperty">This is conditionally shown.</p>

नॉकआउटJS समतुल्य:

<p data-bind="visible: !SomeScopeObservable()">This is conditionally hidden.</p>

ऊपर KnockoutJS उदाहरण मानता SomeScopeObservable एक मानने योग्य है, और क्योंकि हम (की वजह से एक अभिव्यक्ति में उपयोग ! हम छोड़ नहीं कर सकते हैं इसे के सामने ऑपरेटर) () अंत में।

ngClass

गतिशील कक्षाओं के लिए AngularJS कोड:

<p ng-class="{ highlighted: scopeVariableX, 'has-error': scopeVariableY }">Text.</p>

नॉकआउटJS समतुल्य:

<p data-bind="css: { highlighted: scopeObservableX, 'has-error': scopeObservableY }">Text.</p>