AngularJS: एनजी-मॉडल चेकबॉक्स के लिए एनजी-चेक के लिए बाध्यकारी नहीं है

Question 1

मैंने यह प्रश्न पूछने से पहले इसका उल्लेख किया।

AngularJs एनजी-मॉडल के साथ एनजी-चेक को बांधता नहीं है

यदि पक्ष पर ng-checkedमूल्यांकन किया जाता है , तो अद्यतन नहीं किया जाता है। मुझे उपरोक्त प्रश्न में सुझाव नहीं दिया जा सकता है क्योंकि मुझे प्रत्येक चेकबॉक्स के लिए कुछ स्टाइल का उपयोग करना होगा।truehtmlng-modelng-repeat

यहाँ प्लंकर है जो मैंने अपनी समस्या को चित्रित करने के लिए बनाया है।

http://plnkr.co/edit/YsOsPh3vjkPMUUDa6r2t

यह देखने के लिए कि मुझे क्या चाहिए, कृपया कंसोल खोलें, और बस Submitबटन पर क्लिक करें। कृपया कोई चेकबॉक्स न देखें।

अग्रिम में धन्यवाद!

Question 2

ngModelऔर ngCheckedएक साथ उपयोग करने के लिए नहीं हैं।

ngCheckedअभिव्यक्ति की उम्मीद कर रहा है, इसलिए कहकर ng-checked="true", आप मूल रूप से कह रहे हैं कि चेकबॉक्स हमेशा डिफ़ॉल्ट रूप से जांचा जाएगा।

आपको ngModelअपने मॉडल पर बूलियन प्रॉपर्टी से बंधे, बस उपयोग करने में सक्षम होना चाहिए । यदि आप कुछ और चाहते हैं, तो आपको या तो उपयोग करने की आवश्यकता है ngTrueValueऔर ngFalseValue(जो अभी केवल तार का समर्थन करते हैं), या अपना खुद का निर्देश लिखें।

यह वास्तव में क्या है जो आप करने की कोशिश कर रहे हैं? यदि आप चाहते हैं कि पहला चेकबॉक्स डिफ़ॉल्ट रूप से चेक किया जाए, तो आपको अपना मॉडल बदलना चाहिए - item1: true,।

संपादित करें: आपको अपना फ़ॉर्म मॉडल की वर्तमान स्थिति को डीबग करने के लिए सबमिट करने की आवश्यकता नहीं है, btw, आप बस {{testModel}}अपने HTML (या <pre>{{testModel|json}}</pre>) में डंप कर सकते हैं । साथ ही आपकी ngModelविशेषताओं को सरल बनाया जा सकता है ng-model="testModel.item1"।

http://plnkr.co/edit/HtdOok8aieBjT5GFZOb3?p=inview

Question 3

आप कोणीय मान बताने के लिए एनजी-मूल्य-सच का उपयोग कर सकते हैं कि आपका एनजी-मॉडल एक स्ट्रिंग है।

मैं केवल एनजी-ट्रू-वैल्यू काम कर सकता था यदि मैंने अतिरिक्त उद्धरण जोड़े (जैसे कि आधिकारिक कोणीय डॉक्स में दिखाया गया है - https://docs.angularjs.org/api/ng/input/input%5Bcheckbox%bD )

ng-true-value="'1'"

Question 4

आप ng-repeatजो कुछ भी कर सकते हैं उसका उपयोग उस मूल्य के आधार पर किया जा रहा है, जिसके परिणाम पर आप अपनी शैलियों को लागू करने के लिए ng-checkedऔर वहां से इसका उपयोग कर रहे हैं ng-class।

मैंने हाल ही में कुछ ऐसा ही किया और यह मेरे लिए काम कर गया।

Question 5

घोषणा कर सकते हैं के रूप में एनजी init में भी सच हो रही है

<!doctype html>
<html ng-app="plunker" >
  <head>
    <meta charset="utf-8">
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.js"></script>
    <script src="app.js"></script>
  </head>
  <body ng-controller="MainCtrl" ng-init="testModel['item1']= true">
    <label><input type="checkbox" name="test" ng-model="testModel['item1']"  /> Testing</label><br />
    <label><input type="checkbox" name="test" ng-model="testModel['item2']" /> Testing 2</label><br />
    <label><input type="checkbox" name="test" ng-model="testModel['item3']" /> Testing 3</label><br />
    <input type="button" ng-click="submit()" value="Submit" />
  </body>
</html>

और आप पहले एक और वस्तु का चयन कर सकते हैं, यहाँ दिखाया गया है कि यह सच है, झूठा है

Question 6

`ng-model`और `ng-checked`निर्देशों को एक साथ नहीं किया जाना चाहिए

डॉक्स से:

नक़ल किया हुआ

तत्व पर जाँच की गई विशेषता को सेट करता है, अगर अंदर की अभिव्यक्ति ngCheckedसत्य है।

ध्यान दें कि इस निर्देश का उपयोग एक साथ नहीं किया जाना चाहिए ngModel , क्योंकि इससे अप्रत्याशित व्यवहार हो सकता है।

- AngularJS निर्देश-एपीआई एपीआई संदर्भ की जाँच करता है

इसके बजाय नियंत्रक से वांछित प्रारंभिक मूल्य निर्धारित करें:

<input type="checkbox" name="test" ng-model="testModel['item1']" ̶n̶g̶-̶c̶h̶e̶c̶k̶e̶d̶=̶"̶t̶r̶u̶e̶"̶ />
    Testing<br />
<input type="checkbox" name="test" ng-model="testModel['item2']" /> Testing 2<br />
<input type="checkbox" name="test" ng-model="testModel['item3']" /> Testing 3<br />
<input type="button" ng-click="submit()" value="Submit" />

$scope.testModel = { item1: true };

Question 7

ng-checkedजब आप उपयोग करते हैं तो आपको इसकी आवश्यकता नहीं होती है ng-model। यदि आप अपने HTML फॉर्म पर CRUD का प्रदर्शन कर रहे हैं , तो बस CREATEउस मोड के लिए एक मॉडल बनाएं EDITजो डेटा-बाइंडिंग के दौरान आपके मोड के अनुरूप हो :

बनाएँ मोड: केवल डिफ़ॉल्ट मान के साथ मॉडल

$scope.dataModel = {
   isItemSelected: true,
   isApproved: true,
   somethingElse: "Your default value"
}

EDIT मोड: डेटाबेस से मॉडल

$scope.dataModel = getFromDatabaseWithSameStructure()

फिर चाहे वह हो EDITया CREATEमोड, आप लगातार ng-modelअपने डेटाबेस के साथ सिंक करने के लिए अपना उपयोग कर सकते हैं ।

AngularJS: एनजी-मॉडल चेकबॉक्स के लिए एनजी-चेक के लिए बाध्यकारी नहीं है

ng-modelऔर ng-checkedनिर्देशों को एक साथ नहीं किया जाना चाहिए

नक़ल किया हुआ

बनाएँ मोड: केवल डिफ़ॉल्ट मान के साथ मॉडल

EDIT मोड: डेटाबेस से मॉडल

`ng-model`और `ng-checked`निर्देशों को एक साथ नहीं किया जाना चाहिए