AngularJS:仅加载一次数据并使其在所有路径上保持持久性

时间:2015-08-06 18:27:31

标签: json angularjs

在这个问题Loading json data with an AngularJS factory中,大虾写道JSON文件只加载了一次,但我做了一个测试,当我回到那条路线时它再次被加载。

我在这里做错了什么或者我误解了什么?

这是我的傻瓜:http://plnkr.co/edit/k5DbhU6vdxP1Y6phhyzh?p=preview

var app = angular.module('plunker', ['ngRoute']);

app.config(function($routeProvider) {

  $routeProvider
    .when('/home', {
        templateUrl:'home.html', 
        controller:"MainCtrl",
        resolve: {
            load:function(userService){
                  return userService.loadData();
                }
        }
    })
    .otherwise( { 
        templateUrl:'other.html'
    })

});


app.controller('MainCtrl', function($scope, userService) {
  var userData = userService.getData();

  $scope.name = userData.name;

});


app.factory('userService', function ($q, $http) {
var _data = null;

  function _loadData() {
      var defer = $q.defer();
      $http.get('user.json').success(function (data) {
          _data = data;
          console.log("user.json loaded");
          defer.resolve();
      });
      return defer.promise;
  }

  return {
      getData: function () { return _data ; },
      loadData:_loadData
  }
});

1 个答案:

答案 0 :(得分:1)

在userService中,您需要添加一些逻辑来检查是否已经发出$ http请求。 Resolve将在每次访问状态时调用userService.loadData(),而不是每次加载一次。

var defer = false;

function _loadData() {
    if(!defer) {
        defer = $q.defer();
        $http.get('user.json').success(function (data) {
            _data = data;
            console.log("user.json loaded");
            defer.resolve(data);
        });
    }
    return defer.promise;
}