如何在角度js中每5秒重新加载一次网格?

时间:2015-02-27 12:21:35

标签: javascript jquery angularjs

我正在使用角度js和使用,我想每5秒后重新加载网格。

构建网格的角度js代码如下:

App.controller('NGTableCtrl', NGTableCtrl);

function NGTableCtrl($scope, $filter, ngTableParams, $resource, $timeout, ngTableDataService) {
  'use strict';
  // required for inner references
  var vm = this;
  var data = [
  {name: "Moroni",  age: 50, money: -10   },
  {name: "Tiancum", age: 43, money: 120   },
  {name: "Jacob",   age: 27, money: 5.5   },
  {name: "Nephi",   age: 29, money: -54   },
  {name: "Enos",    age: 34, money: 110   },
  {name: "Tiancum", age: 43, money: 1000  },
  {name: "Jacob",   age: 27, money: -201  },
  {name: "Nephi",   age: 29, money: 100   },
  {name: "Enos",    age: 34, money: -52.5 },
  {name: "Tiancum", age: 43, money: 52.1  },
  {name: "Jacob",   age: 27, money: 110   },
  {name: "Nephi",   age: 29, money: -55   },
  {name: "Enos",    age: 34, money: 551   },
  {name: "Tiancum", age: 43, money: -1410 },
  {name: "Jacob",   age: 27, money: 410   },
  {name: "Nephi",   age: 29, money: 100   },
  {name: "Enos",    age: 34, money: -100  }
 ];
 // SELECT ROWS
 vm.data = data;
 vm.tableParams3 = new ngTableParams({
  page: 1,            // show first page
  count: 10          // count per page
  }, {
  total: data.length, // length of data
  getData: function ($defer, params) {
      // use build-in angular filter
      var filteredData = params.filter() ?
              $filter('filter')(data, params.filter()) :
              data;
      var orderedData = params.sorting() ?
              $filter('orderBy')(filteredData, params.orderBy()) :
              data;

      params.total(orderedData.length); // set total for recalc pagination
      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
  }
});

// EXPORT CSV
  var data4 = [{name: "Moroni", age: 50},
  {name: "Tiancum", age: 43},
  {name: "Jacob", age: 27},
  {name: "Nephi", age: 29},
  {name: "Enos", age: 34},
  {name: "Tiancum", age: 43},
  {name: "Jacob", age: 27},
  {name: "Nephi", age: 29},
  {name: "Enos", age: 34},
  {name: "Tiancum", age: 43},
  {name: "Jacob", age: 27},
  {name: "Nephi", age: 29},
  {name: "Enos", age: 34},
  {name: "Tiancum", age: 43},
  {name: "Jacob", age: 27},
  {name: "Nephi", age: 29},
  {name: "Enos", age: 34}];

  vm.tableParams4 = new ngTableParams({
  page: 1,            // show first page
  count: 10           // count per page
  }, {
  total: data4.length, // length of data4
  getData: function($defer, params) {
      $defer.resolve(data4.slice((params.page() - 1) * params.count(), params.page() * params.count()));
  }
  });


  // SORTING
  vm.tableParams = new ngTableParams({
  page: 1,            // show first page
  count: 10,          // count per page
  sorting: {
      name: 'asc'     // initial sorting
  }
  }, {
  total: data.length, // length of data
  getData: function($defer, params) {
      // use build-in angular filter
      var orderedData = params.sorting() ?
              $filter('orderBy')(data, params.orderBy()) :
              data;

      $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
  }
  });

  // FILTERS
  vm.tableParams2 = new ngTableParams({
  page: 1,            // show first page
  count: 10,          // count per page
  filter: {
      name: '',
      age: ''
      // name: 'M'       // initial filter
  }
  }, {
  total: data.length, // length of data
  getData: function($defer, params) {
      // use build-in angular filter
      var orderedData = params.filter() ?
             $filter('filter')(data, params.filter()) :
             data;

      vm.users = orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count());

      params.total(orderedData.length); // set total for recalc pagination
      $defer.resolve(vm.users);
  }
  });

  }

如果我在函数中使用setTimeout,那么它不会刷新新值。

任何帮助/建议都将不胜感激。

2 个答案:

答案 0 :(得分:3)

不确定每5秒钟需要包装和执行哪个功能,但您可以使用Angular Interval服务。

只需将$interval注入您的控制器并执行此操作:

$interval(functionToRerun, 5000);

这样它每5秒重新运行一次。

快速说明为什么setTimeout没有刷新视图上的值:setTimeout不是Angular函数,因此Angular不知道更改,因此$ digest循环没有运行和更改没有反映出来。

答案 1 :(得分:1)

尝试.. $interval

$interval(function () {
    loadData();
}, duration)

有关此内容的更多信息,请参阅.. https://docs.angularjs.org/api/ng/service/ $ interval