title: How can I get my ng-grid to re-sort itself?
body: <p>I have some data displayed in an ng-grid.</p>
  
  <p>Some of this data is displayed nearly immediately after the page loads; other data is slower and we stitch it in once it's received.</p>
  
  <p>In doing this, sorting can break if the grid is set to sort data that isn't there when the first half of the data is rendered in the grid.</p>
  
  <p>Is there a nice way to tell the grid to re-sort itself and preserve multiple columns as well as sort directions once all of the data has been received?</p>
  
  <p>JS</p>
  
  <pre><code>var app = angular.module('myApp', ['ngGrid']);
  
  app.controller('MyCtrl', function ($scope) {
      $scope.myData = [{name: "Moroni", age: 50},
                       {name: "Tiancum", age: 43},
                       {name: "Jacob", age: 43},
                       {name: "Nephi", age: 29},
                       {name: "Enos", age: 34}];
  
      $scope.gridOptions = { 
          data: 'myData',
          columnDefs: [{ field: "name", },
                       { field: "age" },
                       { field: "state" }],
          sortInfo: {
              fields: [ 'age', 'state' ],
              directions: [ 'asc', 'desc' ]
          }
      };
  
      var lateData = [
          { name: 'Moroni', state: 'NY' },
          { name: 'Tiancum', state: 'CA' },
          { name: 'Jacob', state: 'PA' },
          { name: 'Nephi', state: 'AK' },
          { name: 'Enos', state: 'MO' }
      ];
  
      setTimeout(function () {
          $scope.myData = _.merge($scope.myData, lateData);
          $scope.$digest();
      }, 3000);
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div ng-app="myApp"&gt;
      &lt;div ng-controller = "MyCtrl"&gt;
          &lt;div ng-grid="gridOptions" class="gridStyle"&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.gridStyle {
      border: 1px solid rgb(212, 212, 212);
      width: 100%;
      height: 500px;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/akukucka/4vrQq/" rel="nofollow">http://jsfiddle.net/akukucka/4vrQq/</a></p>