如果您想根據變量將複選框設置爲true,則可以在輸入標籤中設置ng-checked="variable"
。
如果變量是true
該框將被檢查。如果它是false
它不會。或者,表達式也可以工作,例如, ng-checked="1===1"
將評估爲true。
如果您想根據用戶單擊複選框來更改其他內容,請在輸入標記中設置ng-click="someCtrlFunction()"
。這將在您的控制器中調用一個函數。如果你綁定了你可以從你的控制器中查找複選框的值。
這裏有一個小提琴:http://jsfiddle.net/E8LBV/10/和下面的代碼:
HTML
<div ng-app="App">
<div ng-controller="AppCtrl">
<ul>
<li ng-repeat="user in users">{{user.name}}
<ul>
<li ng-repeat="account in user.accounts">
<input type="checkbox" ng-model="checked" ng-checked="account == user.default" ng-click="changeDefault(user.id,account,checked)">{{account}}</input>
</li>
<ul/>
</li>
</ul>
</div>
</div>
JS
var app = angular.module('App', []);
app.service('Users', function() {
var Users = {};
Users.data = [{
'id': 1,
'name': 'jon',
'default': null
}, {
'id': 2,
'name': 'pete',
'default': null
}];
return Users;
});
app.service('Accounts', function() {
var Accounts = {};
Accounts.data = [{
'user': 1,
'ac': 123456
}, {
'user': 2,
'ac': 456832
}, {
'user': 2,
'ac': 345632
}, {
'user': 1,
'ac': 677456
}];
return Accounts;
});
app.controller('AppCtrl', function ($scope, Users, Accounts) {
$scope.users = Users.data;
//attach accounts to user
for (i = 0; i < $scope.users.length; i++) {
$scope.users[i].accounts = [];
for (ii = 0; ii < Accounts.data.length; ii++) {
if (Accounts.data[ii].user == $scope.users[i].id) {
$scope.users[i].accounts.push(Accounts.data[ii].ac);
}
}
}
//function to change the default account for the user
$scope.changeDefault = function (id, account, checked) {
if (!checked) {
return;
}
for (i = 0; i < $scope.users.length; i++) {
if ($scope.users[i].id == id) {
$scope.users[i].
default = account;
}
}
}
});
喜謝爾蓋,我給你我的回答工作提琴。 Dewd – dewd
如果只有一個帳戶可以成爲默認帳戶,您可能需要用單選按鈕替換複選框。 – callmekatootie