2017-02-25 51 views
0

我想在加載時選擇其中的一些複選框。我需要能夠選擇並取消選中頁面加載後的所有複選框。到目前爲止,我嘗試過:$ 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; 
}; 
}) 
+0

您已經定義了一個目標,但不是一個具體的問題或問題涉及到你的代碼。請通讀[問]。您通常使用'ng-model'作爲複選框狀態。我們也不知道'itemSelected'是什麼,它沒有被定義在任何地方 – charlietfl

+0

謝謝。我將itemSelected作爲參數傳遞給toggleItem – user6440175

+0

最好不要使用帶有角度的javascript .... – MukulSharma

回答

0

這個錯誤在ng 1.1.2以下的角度材料版本中檢查過,但它已經在版本1.1.1中修復了。請參閱更改日誌鏈接https://github.com/angular/material/blob/master/CHANGELOG.md。如果您想使用ng-check,請抓取最新版本。

或者,您可以使用ng-model來檢查和取消選中複選框。通過操作數組來添加checked屬性,可以將其操作爲false或true,並在複選框中將此屬性用作ng-model。謝謝。

查看

<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> 

控制器

$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 }]; 
+0

謝謝。您的建議可行,但取消選中複選框我必須點擊兩次。我該如何解決這個問題? – user6440175

+0

我以前也經歷過這個。我認爲它已被固定在角材料版本2,請看到這個問題,https://github.com/angular/material2/pull/672 – digit

+0

嘗試使用NG-的變化,而不是NG單擊 – digit

相關問題