javascript - ng-grid:如何显示真/假值的复选框

标签 javascript html angularjs ng-grid

在 angularjs 脚本中,我有“ng-grid”模块,在一列中,我想显示复选框控件,而不是从 json 数据返回的 true/false 字符串。 如果 json 变量为真,则必须选中复选框,如果为假,则必须取消选中。

我想我必须使用模板,但我不知道如何。

如何显示复选框?有一些例子吗?

谢谢

最佳答案

像这样:更新了更改处理程序

    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);
      }
    });

您现在可以添加一个更改处理程序,或者如果您只想显示该值,则只需将输入设置为禁用/只读。

Plunker

Plunker with change handler

(我为 Jacob 和 Enos 感到非常抱歉!)

关于javascript - ng-grid:如何显示真/假值的复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23152402/

相关文章:

javascript - 自定义插件在clone() JQuery之后引用错误的$(this)

html - 如何在mysql数据库中保存和搜索内容(使用wysiwyg html编辑器制作)?

javascript - Jquery 在图像问题下显示圆形标记图像

javascript - AngularJs 不渲染值

javascript - 通过点击 angularjs 传递数据

javascript - setInterval函数区别 Date.now()

javascript - 我可以从 ng-app 外部注册 ng-template

javascript - IE11 上的 "Error: Invalid argument."

javascript - for循环内数组的总和

javascript - 绘图应用程序撤消按钮