Angular UI 网格如何从变量绑定值

Question

是否可以在 Angular UI 网格中绑定来自 $scope variable 的值？有一个 $scope.number 值，我想绑定并显示在数字列中：

app.controller('MainCtrl', function ($scope, $http) {
  $scope.gridOptions = { enableRowSelection: true, enableRowHeaderSelection: false };

  $scope.number = 01234567;

  $scope.gridOptions.columnDefs = [
    { field: "contactId", displayName: "CID", width: 60 },
    { field: "name", displayName: "Contact Name" },
    { field: "number", displayName: "Number", cellTemplates: '<div class="ui-grid-cell-contents"> {{row.entity.number}} </div>'}
  ];

  $scope.contacts = [];

  $http.get('contacts.json').success(function (data) {
    data.forEach( function( row, index ) {
        $scope.contacts.push(row);
    });
    $scope.gridOptions.data = data;
    console.log('data from contacts.json', data);
    });

});

我试图在 CellTemplate 属性中定义 row.entity，但它不起作用。 plunker

Answer 1

您必须将 $scope 变量添加到您的数据数组中：

var app = angular.module('app', ['ui.grid']);

app.controller('MainCtrl', function ($scope, $http) {
  $scope.gridOptions = { enableRowSelection: true, enableRowHeaderSelection: false };
  
  $scope.number = 01234567;
  
  $scope.gridOptions.columnDefs = [
    { field: "contactId", displayName: "CID", width: 60 },
    { field: "name", displayName: "Contact Name" },
    { field: "number", displayName: "Number", cellTemplates: '<div class="ui-grid-cell-contents"> {{row.entity.number}} </div>'}
  ];
  
  $scope.contacts = [];

  $http.get('contacts.json').success(function (data) {
    data.forEach( function( row, index ) {
        row.number = $scope.number;
        $scope.contacts.push(row);
    });
    $scope.gridOptions.data = data;
    console.log('data from contacts.json', data);
 });

});

Angular UI 网格如何从变量绑定值

Angular UI Grid How to bind value from variable

angularjs

angular-ui-grid