Angular UI Grid如何绑定变量的值

时间:2016-09-19 13:06:06

标签: angularjs angular-ui-grid

是否可以绑定Angular UI Grid中$scope variable的值? 我想要绑定并显示在Number列中的$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

1 个答案:

答案 0 :(得分: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);
	});

});