如果尚未加载数据,则在每个角度控制器中调用API

时间:2015-03-20 13:43:23

标签: angularjs http

我正在使用angular和.net后端构建单页应用。 除了控制器调用的各个静态资源之外,我还有一个系统资源,它为应用程序提供大多数控制器使用/需要的系统范围信息。 我调用系统服务并在用户首次登录时将数据存储在rootScope中。

但是,如果由于某种原因用户刷新将丢失rootScope的页面,则系统数据将丢失,并且控制器不再可用。

如果页面重新加载发生,我设法让系统服务触发但是问题是在很多情况下从控制器运行的服务发生在系统服务调用之前,这意味着控制器时数据并不总是可用运行。

以角度处理这个问题的正确方法是什么?有没有办法让我的控制器依赖于某个rootScope状态,如果有必要,会在控制器自己进行服务调用之前调用我的系统服务API?

由于

1 个答案:

答案 0 :(得分:1)

一种方法可能是创建一个工厂/服务,该工厂/服务由需要此信息的每个控制器注入并调用。这样你就不必混淆$rootScope

应该缓存获取信息的请求,这样您每次切换控制器时都不必触发获取信息。如果您想在页面刷新后保留信息,可以使用localstorage来存储数据。

示例工厂:

angular.module('appName')
    .factory('Settings', ['$http', function ($http) {
        function getData() {
            var url = 'url/to/endpoint';
            return $http.get(url, {cache: true});
        }
        return {
            promise: getData()
        };
    }]);

通过从工厂返回承诺,我们确保getData()调用仅运行一次。虽然在这个特定的例子中它几乎没有任何区别(因为它已经返回了一个内在的承诺),但这是一种遵循最佳实践的模式。

此模式还意味着无论消费控制器是否访问承诺,都会在首次​​使用时调用getData()。这允许容易地暴露数据(数据绑定),而无需在某些用例中使用promise。

在控制器中使用:

angular.module('appName')
    .controller('VeryNiceCtrl', ['$scope','Settings', function ($scope, Settings) {
        Settings.promise.success(function(response){
            var appSettings = response;
            // do stuff
        })
}])