Come assegnare dinamicamente valore per ng-model in angularjs?

Question

Eccomi generando un elemento HTML in modo dinamico utilizzando ng-repeat esempio

<div ng-repeat="type in types"> 
    <input type="checkbox" ng-model="{{type}}" />{{ type }} 
</div> 

voglio impostare il valore tipo per ng-modello. E 'possibile, altrimenti voglio impostare tale valore tipo per ng-true-valore come questo

<div ng-repeat="type in types"> 
    <input type="checkbox" ng-model="{{type}}" ng-true-value="{{type}}" />{{ type }} 
</div> 

Answer 1

Dal NG-repeat crea un ambito figlio per ogni tipo/item/iterazione, abbiamo bisogno di associare il modello ng per ogni tipo con lo scopo genitore, piuttosto che la portata del bambino. Un modo per farlo è quello di utilizzare $ genitore:

<input type="checkbox" ng-model="$parent[type]">{{ type }} 

Se $ scope.types è definito come in @ risposta di Alex, poi proprietà typeOne, typeTwo, e apparirà typeThree sulla portata genitore se la casella corrispondente è cliccato, e il valore della proprietà sarà true. Se si fa nuovamente clic su una casella di controllo, la proprietà rimane e il valore passerà a false. Il tuo codice dovrebbe pertanto verificare la presenza di proprietà inesistenti e di proprietà esistenti con il valore impostato su true o false. È un po 'disordinato.

preferirei predefinire un array di oggetti sul campo di applicazione genitore, dove ogni oggetto ha il tipo (nome), e un valore booleano per indicare se è selezionato o meno:

$scope.types = [ 
    {name: 'typeOne', selected: false}, 
    {name: 'typeTwo', selected: false}, 
    {name: 'typeThree', selected: false}]; 

Poi, $ genitore non è necessario (perché il valore di "tipo" sarà un riferimento all'oggetto genitore, piuttosto che una copia del valore della proprietà genitore (primitiva)):

<input type="checkbox" ng-model="type.selected">{{ type.name }} 

Vedi anche What are the nuances of scope prototypal/prototypical inheritance in AngularJS? saperne di più su ng -ripetizione e ambiti figlio.

Answer 2

È possibile memorizzare i valori dinamici in una delle proprietà del $ del campo di applicazione come segue:

function DynamicController($scope) { 
    $scope.types = [ 
     "typeOne", 
     "typeTwo", 
     "typeThree"   
    ]; 
    $scope.typeValues = {}; 
}; 

<div ng-app ng-controller="DynamicController"> 
    <div ng-repeat="type in types"> 
     <input type="checkbox" ng-model="typeValues[type]" ng-click="show()" /> {{ type }} 
    </div> 

    <h3>Values</h3> 
    <div ng-repeat="type in types"> 
     {{ type }} : {{ typeValues[type] }} 
    </div> 
</div> 

È quindi possibile controllare i valori tramite la proprietà typeValues ​​del proprio ambito.

var i, 
    length = $scope.types.length; 

for (i = 0; i < length; i++) { 
    console.log($scope.types[i] + " : " + $scope.typeValues[$scope.types[i]]); 
}