ng-Modellwert innerhalb ng-repeat nicht

Question

Haben Sie Probleme arbeiten ng-Modellwerte innerhalb ng-repeat

Also ich wiederhole dies div mit einer Reihe von JSON-Objekte zuweisen. Ich kann den "ID" -Wert des Objekts innerhalb eines beliebigen Elements drucken. Aber ich kann das nicht als ng-Modell-Wert für die Checkbox verwenden. Ich muss hier etwas falsch machen. Irgendeine Idee was das ist?

Werde es wirklich schätzen, wenn jemand einen Blick darauf werfen kann.

Hier ist ein Codepen des Problems. Code pen link

. 

Answer 1

Wert für das Modell, das die Checkbox zuweisen ist boolean, ob es wahr oder falsch ist, es sei denn, Sie den Wert definieren. aber wieder ist es nur 2 Optionen Wert.

also, anstatt id als Modellattribut zu verwenden, könnten Sie es zu einem Attribut ändern, das booleschen Wert speichern könnte. warum nicht 'IsSelected' unter Verwendung

<div ng-controller="quoteController" ng-app="MyApp" class="benefits-container"> 
    <!-- benefits --> 
     <div class="benefit" ng-class="{'selected': pe.id}" ng-repeat="pe in policyEnhancementsArr | filter: {type:'optional'}"> 
      <div class="top"> 
       <md-checkbox ng-model="pe.isSelected" class="blue"></md-checkbox> 
       <h5 class="item">{{pe.name}}</h5> 
       <h5 class="prize">{{pe.loading}}</h5> 
      </div> 
      <div class="bottom"> 
       <p>{{pe.limitDisplay}}</p> 
      </div> 
     </div> 
    </div> 

dann aktualisieren einige isSelected Wert:

... 
{ 
    "id": "PVC022", 
    "name": "NCD Protector", 
    "limit": null, 
    "limitDisplay": "N/A", 
    "desc": "<TBC>", 
    "type": "optional", 
    "loading": 0.0, 
    "isSelected": true 
}, 
... 

Answer 2

i genau der Unterschied den gleichen Code getan haben, ist der Filter, die Sie auf ng-bind angewendet. versuche den Artikel zu lesen Ich empfehle n-Wert zu verwenden.

whats the difference between ng-model and ng-value

Answer 3

versuchen, mit ng-repeat und ng-Modell die gleiche Linie withing.

anstelle dieses

<div class="benefit" ng-class="{'selected': pe.id}" ng-repeat="pe in policyEnhancementsArr | filter: {type:'optional'}"> 
      <div class="top"> 
       <md-checkbox ng-model="pe.id" class="blue"></md-checkbox> 

Verwendung dieses

<div class="benefit" ng-class="{'selected': pe.id}" ng-repeat="pe in policyEnhancementsArr | filter: {type:'optional'}" 
ng-model="pe.id"> 
       <div class="top"> 
        <md-checkbox class="blue"></md-checkbox>