码迷,mamicode.com
首页 > 其他好文 > 详细

Checklist-model

时间:2017-07-08 12:25:09      阅读:208      评论:0      收藏:0      [点我收藏+]

标签:blank   href   objects   bind   admin   ctr   color   box   div   

 [checkbox写在js里]

Array of objects (pick id) 

html

<label ng-repeat="role in roles">
  <input type="checkbox" checklist-model="user.roles" checklist-value="role.id"> {{role.text}}
</label>

js

var app = angular.module("app", ["checklist-model"]);
app.controller(‘Ctrl2‘, function($scope) {
  $scope.roles = [
    {id: 1, text: ‘guest‘},
    {id: 2, text: ‘user‘},
    {id: 3, text: ‘customer‘},
    {id: 4, text: ‘admin‘}
  ];
  $scope.user = {
    roles: [2, 4]
  };
  $scope.checkAll = function() {
    $scope.user.roles = $scope.roles.map(function(item) { return item.id; });
  };
  $scope.uncheckAll = function() {
    $scope.user.roles = [];
  };
  $scope.checkFirst = function() {
    $scope.user.roles.splice(0, $scope.user.roles.length); 
    $scope.user.roles.push(1);
  };
});

原文阅读在这儿呢^_^

 [checkbox写在html里]

html

<label><input type="checkbox" checklist-model="user.roles" value="a"> Administrator</label>
<label><input type="checkbox" checklist-model="user.roles" value="c"> Customer</label>
<label><input type="checkbox" checklist-model="user.roles" value="g"> Guest</label>
<label><input type="checkbox" checklist-model="user.roles" value="u"> User</label>

js

var app = angular.module("app", ["checklist-model"]);
app.controller(‘Ctrl4a‘, function($scope) {
  $scope.roles = {
    a: ‘Administrator‘,
    c: ‘Customer‘,
    g: ‘Guest‘,
    u: ‘User‘
  };
  $scope.user = {
    roles: [‘c‘]
  };
  $scope.checkAll = function() {
    $scope.user.roles = Object.keys($scope.roles);
  };
  $scope.uncheckAll = function() {
    $scope.user.roles = [];
  };
  $scope.checkFirst = function() {
    $scope.user.roles.splice(0, $scope.user.roles.length); 
    $scope.user.roles.push(‘a‘);
  };
});

Checklist-model

标签:blank   href   objects   bind   admin   ctr   color   box   div   

原文地址:http://www.cnblogs.com/miny-simp/p/7136202.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!