Question

我希望每次json文件中的数据更改时都更新我的视图，而无需手动刷新页面。我使用以下方法进行一些数据轮询。这是我的服务文件获取$ http

.service('employees', function ($http) {
    this.getEmployees = function() {
      return $http.get( './data/employee.json' );
    };

这是我的控制器

.controller('The3Ctrl', function ($scope, employees, $interval) {
   var _this = this;
  $scope.getData = function() {
    employees.getEmployees().then(function(response){
        _this.items = response.data;
        $scope.items = _this.items;
    });
  }
  $scope.getData();

  $interval(function(){
    $scope.getData();
  }, 10000);

这样，getData函数每10秒触发一次。但是，我想要的是只有在data（data.json）文件发生更改时才会触发该函数。如果没有数据更改，则触发该功能无效。

Answer 1

你提到什么＆＃34;改变＆＃34;或者什么是问题当视图没有更新你可以使用$scope.$apply(); 或者您可以使用

检测更改

$scope.$watch('element', function () {
    console.error('element' + element + ' changes');
})

Answer 2

如果文件位于App中：

 scope.$watch('Data', function(newValue, oldValue) {
 if (newValue){

   }
  });

如果文件位于服务器上：

您可以通过轮询实现此目的，使用旧回调完成轮询，您可以重复调用它们而无需创建新的承诺实例。它像计时器一样工作，这是样本

var app = angular.module("myApp", []);    
    app.controller("The3Ctrl", ["$scope","$http","$timeout",
        function($scope, $http,$timeout) {
        var nextPolling;
        var pollingInterval = 10000; // 10 seconds
        var _polling = function ()
        {
            $http.get('./data/employee.json')
                .success(function(data) {$scope.items = data;})
                .error(function(data) {console.log('error');})
                .finally(function(){ nextPolling = $timeout(_polling, pollingInterval); });
        };

        _polling();

        $scope.$on('$destroy', function (){
            if (nextPolling){
                $timeout.cancel(nextPolling);
            }
        });


    }]);

工作App

如何在json文件中查看数据更改

2 个答案: