javascript ng-grid：如何显示真/假值的复选框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23152402/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ng-grid: how show checkbox for true/false value
提问by Tom
In angularjs script i have the "ng-grid" module and, in one column, i want show the checkbox control instead of the true/false string returned from json data. The checkbox must be checked if the json variable is true and unchecked if false.
在 angularjs 脚本中，我有“ng-grid”模块，并且在一列中，我想显示复选框控件而不是从 json 数据返回的真/假字符串。如果 json 变量为真，则必须选中该复选框，如果为假，则必须取消选中该复选框。
I think i must use the template but i don't know how.
我想我必须使用模板，但我不知道如何使用。
How can i show the checkboxes? There are some examples?
如何显示复选框？有一些例子吗？
Thanks
谢谢
回答by mainguy
Like this: updated with change handler
像这样：用更改处理程序更新
var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
$scope.myData = [{
name: "Moroni",
age: 50,
dude: true
}, {
name: "Tiancum",
age: 43,
dude: true
}, {
name: "Jacob",
age: 27,
dude: false
}, {
name: "Nephi",
age: 29,
dude: true
}, {
name: "Enos",
age: 34,
dude: false
}];
$scope.gridOptions = {
data: 'myData',
columnDefs: [{
field: 'name',
displayName: 'Name'
}, {
field: 'age',
displayName: 'Age'
}, {
field: 'dude',
displayName: 'Dude',
cellTemplate: '<input type="checkbox" ng-model="row.entity.dude" ng-click="toggle(row.entity.name,row.entity.dude)">'
}]
};
$scope.toggle = function(name, value) {
//do something usefull here, you have the name and the new value of dude. Write it to a db or else.
alert(name + ':' + value);
}
});
You now can add an change handler or just set the input to disable/readonly if you just want to display the value.
如果您只想显示值，您现在可以添加更改处理程序或仅将输入设置为禁用/只读。
(I'm so sorry for Jacob and Enos!)
（我为雅各布和以诺斯感到非常抱歉！）
回答by Chandermani
You need to define a cellTemplate when you define you ng-grid definition of fields. See "String-based Cell Templates" section in the documentation for example
当您定义字段的 ng-grid 定义时，您需要定义一个 cellTemplate。例如，请参阅文档中的“基于字符串的单元格模板”部分
{field:'age', displayName:'Age', cellTemplate: '<div ng-class="{green: row.getProperty(col.field) > 30}"><div class="ngCellText">{{row.getProperty(col.field)}}</div></div>'}]
};
It uses div, you can use input.
它使用div，您可以使用input。
