Angular UI Grid How to bind value from variable

Question

is it possible to bind value from the $scope variable in Angular UI Grid? There is a $scope.number value which I want to bind and show in Number column:

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

});

I'm trying to define row.entity in CellTemplate property, but it doesn't work. plunker

xphong · Accepted Answer · 2016-09-19 13:34:13Z

You would have to add the $scope variable to your data array:

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

});

Collectives™ on Stack Overflow

Angular UI Grid How to bind value from variable

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related