Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You need to define your column as an object and define your <strong>cellTemplate</strong>. Then use the age property in your sortFn (<a href="http://plnkr.co/edit/qmBsneZ3HmFRKSkjbBWU?p=preview" rel="noreferrer">http://plnkr.co/edit/qmBsneZ3HmFRKSkjbBWU?p=preview</a>):</p> <pre><code>// main.js var app = angular.module('myApp', ['ngGrid']); app.controller('MyCtrl', function($scope) { //Notice age is now an object to be used with the cellTemplate var myData1 = [{name: "Moroni", age: {age: 50, ageWord: "Fifty"}}, {name: "Tiancum", age: {age: 43, ageWord: "Forty-Three"}}, {name: "Mildred", age: {age: 70, ageWord: "Seventy"}}, {name: "Jacob", age: {age: 27, ageWord: "Twenty-Seven"}}]; $scope.gridOptions = { data: 'gridData', columnDefs: [ {field: 'name', displayName: 'Name'}, {field:'age', displayName:'Age', cellTemplate: '&lt;div class="ngCellText" ng-class="col.colIndex()"&gt;&lt;span ng-cell-text&gt;{{COL_FIELD.ageWord}}&lt;/span&gt;&lt;/div&gt;', sortFn: function (a, b) { //compare age property of the object if (a.age &lt; b.age) { return -1; } else if (a.age &gt; b.age) { return 1; } else { return 0; } } }] }; $scope.gridData = myData1; }); </code></pre> <p>According to the docs, cellTemplate defaults to:</p> <pre><code>&lt;div class="ngCellText" ng-class="col.colIndex()"&gt;&lt;span ng-cell-text&gt;{{COL_FIELD CUSTOM_FILTERS}}&lt;/span&gt;&lt;/div&gt; </code></pre> <p>So all you need to do is use {{COL_FIELD.age}} and any custom filters you may (or may not) have.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload