Question

在我的角度应用程序中，我有一个视图，一个控制器和一个服务。服务负载资源ex：服务加载人员并使用结果初始化值。我希望在我的服务完成其功能以加载他的资源后加载我的视图。

var myApp = angular.module('myApp',[]);

myApp.controller('PersonsCtrl', ($scope, Persons) {
    $scope.persons = Persons.data;
});

myApp.factory('Persons', {
    data: [[function that load resources => take time]]
});

所以当我的服务完成初始化时，我想加载我的控制器。一些想法？

Answer 1

假设您有路由提供者，这是一个基本示例。当promise被解决时，“personData”将被注入您的控制器。关于你的服务做什么的信息不多，所以我不得不提供非常通用的东西。

myApp.config(['$routeProvider', function($routeProvider) {
    $routeProvider
        .when('/persons', {
            controller: 'PersonsCtrl',
            templateUrl: 'persons.html',
            resolve: {
                personData: ['Persons', function(Persons) {
                    return Persons.getData();
                }]
            }
        });
}]);

myApp.controller('PersonsCtrl', ($scope, personData) {
    $scope.persons = personData;
});

myApp.factory('Persons', {
    getData: function() {//function that returns a promise (like from $http or $q)};
});

Answer 2

也许尝试使用promises，例如

var myApp = angular.module('myApp',[]);

myApp.controller('PersonsCtrl', ($scope, Persons) {
    $scope.persons = Persons.getData().then(function(response){
        //do whatever you want with response
    });
});

myApp.factory('Persons', function ($http, $q) {
    return {
        getData: function () {
            var def = $q.defer();
            $http.get('url').
                success(function (response) {
                    def.resolve(response);
                })
            return def.promise();
        }
    }
});

在angularjs中加载服务之后的视图

2 个答案: