Wie Kontrollkästchen auf Last Seite

Question

ich wählen versuche einige dieser Kontrollkästchen auf Last auszuwählen. Ich muss alle Kontrollkästchen aktivieren und deaktivieren können, nachdem die Seite geladen wurde. Bisher habe ich versucht: $ scope.itemSelected = [{"ItemID": 1, "ItemName": "Item 1"}];

 div ng-repeat="item in itemItems"> 
      <md-checkbox ng-checked="existsItem(item, itemSelected);" ng-click="toggleItem(item, itemSelected);" value="{{item.ItemID}}"> 
       {{item.ItemName}} 
      </md-checkbox> 
     </div> 

angular.module('MyApp', ['ngMaterial']) 
.controller('AdminController', function ($scope) { 

$scope.itemItems = [{ "ItemID": 1, "ItemName": "Item 1" }, { "ItemID": 2, "ItemName": "Item 2" }, 
    { "ItemID": 3, "ItemName": "Item 3" }, { "ItemID": 4, "ItemName": "Item 4" }, 
    { "ItemID": 5, "ItemName": "Item 5" }]; 
$scope.itemSelected = []; 

$scope.toggleItem = function (item, list) { 
    var idx = list.indexOf(item); 
    if (idx > -1) { 
     list.splice(idx, 1); 
    } 
    else { 
     list.push(item); 
    } 
}; 

$scope.existsItem = function (item, list) { 
    return list.indexOf(item) > -1; 
}; 
}) 

Answer 1

Dies ist eher Bugs mit ng-geprüft in Winkelmaterial Version unter 1.1.1, aber es hat sich bereits in der Version 1.1.1 behoben. Siehe changelog unter diesem Link https://github.com/angular/material/blob/master/CHANGELOG.md. Wenn Sie ng-check verwenden möchten, nehmen Sie bitte die neueste Version.

Alternativ können Sie mit ng-model die Kontrollkästchen aktivieren und deaktivieren. Indem Sie Ihr Array so manipulieren, dass ein geprüftes Attribut hinzugefügt wird, können Sie es als falsch oder wahr definieren und dieses Attribut als ng-model im Kontrollkästchen verwenden. Vielen Dank.

Ansicht

<div ng-repeat="item in itemItems"> 
     <md-checkbox ng-checked="existsItem(item, itemSelected);" ng-click="toggleItem(item, itemSelected);" 
       ng-model="item.checked" value="{{item.ItemID}}"> 
       {{item.ItemName}} 
     </md-checkbox> 
    </div> 

-Controller

$scope.itemItems = [{ "ItemID": 1, "ItemName": "Item 1", "checked":true}, { "ItemID": 2, "ItemName": "Item 2" , "checked":false}, 
    { "ItemID": 3, "ItemName": "Item 3", "checked":false }, { "ItemID": 4, "ItemName": "Item 4" , "checked":false}, 
    { "ItemID": 5, "ItemName": "Item 5", "checked":false }];