AngularJS应用程序中的异步延迟

我想在加载应用程序时在全局变量/rootScope中设置一个数组。 我从问题服务处获得数据。因为我想缓存加载时的问题，所以我尝试了很多方法将其缓存在angular module run函数中的rootScope中。但每次异步调用都会导致延迟。滞后意味着当我第二次打开页面时，会在页面上呈现数据

尝试了一种解决方案（有效）：在问句服务all方法中返回承诺-但需要注意的是，每当我执行问句服务

all（）

方法时，它都会调用api

请建议

以下是我的代码：

App.js

angular.module('starter', ['ionic', 'starter.controllers', 'starter.services'])

.run(function ($ionicPlatform, Questions,$rootScope) {
    $ionicPlatform.ready(function () {
        // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
        // for form inputs)
        if (window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        }
        if (window.StatusBar) {
            // org.apache.cordova.statusbar required
            StatusBar.styleDefault();
        }
    });

//starter.services.
//Questions.store().then(function (res) { $rootScope.questions = res.data });

})

Controllers.js

angular.module('starter.controllers', [])

.controller('DotnetCtrl', function ($scope, Questions, $rootScope) {
    $scope.questions = Questions.all();
})

Service.js

.factory('Questions', function ($http) {
var questions = [];

$http.get('http://api.clickmynotes.com/api/questions').success(function (data) { questions = data; });

return {
    all: function () {
        return questions;

    },
    get: function (id) {
        return questions[id];
    }
}
});

问题在于：

.success(function (data) { questions = data; });

这意味着，当您最终从服务器获取数据时，您将用一个新的数组替换问题数组。由于控制器在收到htttp响应时已经调用了

Questions.all（）

，因此它已经获得了前面的空问题数组，并且控制器引用的数组保持原样

相反，您需要填充控制器已经获得的数组：

.success(function (data) { 
    angular.forEach(data, function(element) {
        questions.push(element);
    }); 
});

这样，控制器最初会得到一个空数组，页面不会显示任何元素，但一旦服务器的响应可用，控制器引用的问题数组就会填充，视图会重新绘制自身，显示元素

---

此技术是$resource服务使用的技术。

1-您需要在查看之前使用ui路由器中的resolve来获取数据。2-将数据缓存在本地存储中。