title: Angular Store Data and Reload Datatable
body: <p>I'm using 
  datatable: <a href="https://l-lin.github.io/angular-datatables" rel="noreferrer">https://l-lin.github.io/angular-datatables</a>
  and bootstrap: <a href="https://angular-ui.github.io/bootstrap/" rel="noreferrer">https://angular-ui.github.io/bootstrap/</a></p>
  
  <p>this what i try to achive: after add data using modal from bootstrap and save it, the datatable is reload (without reload current route).</p>
  
  <p>Here is my modalCtrl:</p>
  
  <pre><code>  .controller('addModalCtrl', ['$scope', '$modalInstance', '$http', 'AdminMenu', 'ResultService',
      function ($scope, $modalInstance, $http, AdminMenu, ResultService) {
  
      $scope.cancel = function () {
          $modalInstance.dismiss('cancel');
      };
  
      $scope.menu = {};
  
      $scope.doSubmit = function () {
          var data = {
              name: $scope.menu.title,
              icon: $scope.menu.icon
          };
  
          AdminMenu.save(data, function (response) {
              $scope.menu = {};
              ResultService(response);
              $modalInstance.dismiss('cancel');
          }, function (response) {
              ResultService(response.data);
          })
      };
  }])
  </code></pre>
  
  <p>here is my datatable function:</p>
  
  <pre><code> function AdminMenuTableData($compile, $scope, $modal, DTOptionsBuilder, DTColumnBuilder, SweetAlert, AdminMenu, ResultService, APIROOT) {
  
  $scope.dtOptions = DTOptionsBuilder.fromSource(APIROOT + 'admin-menus')
      .withOption('order', [0, "asc"])
      .withOption('createdRow', function (row, data, dataIndex) {
          // Recompiling so we can bind Angular directive to the DT
          $compile(angular.element(row).contents())($scope);
      });
  
  $scope.dtColumns = [
      DTColumnBuilder.newColumn('id', 'ID').withOption('searchable', false),
      DTColumnBuilder.newColumn('name', 'Name'),
      DTColumnBuilder.newColumn('', 'Actions').renderWith(function (data, type, full, meta) {
          return '&lt;a class="btn btn-default btn-xs" ng-click=edit(' + full.id + ')&gt;&lt;i class="fa fa-pencil"&gt;&lt;/i&gt;&lt;/a&gt; ' +
              '&lt;a class="btn btn-danger btn-xs" ng-click=delete(' + full.id + ')&gt;&lt;i class="fa fa-trash"&gt;&lt;/i&gt;&lt;/a&gt;';
      }).notSortable()
  ];
  
  $scope.dtInstance = {};
  
  function reloadData()
  {
      $scope.dtInstance.reloadData();
  }
  </code></pre>
  
  <p>}</p>
  
  <p>How can i call reloadData() function so i can refresh the datatable. I've tried to inject AdminenuTableData function but no luck. injector failed.</p>
  
  <p>Any suggestion?</p>