Question

我想在页面加载之前加载两个API为此我在 $ stateProvider中使用了以下代码

.state('admin-panel.default.jobadd', {
    url: '/jobadd/:jobID',
    templateUrl: 'app/search/jobadd.tmpl.html',
    controller: 'JobaddController', 
    resolve: {   
      jobAdd: ['Search', '$stateParams','$q', function(Search,$stateParams,$q) { //Search is service   
           var jobAdd = Search.jobAdd($stateParams.jobID);
           var isApplied = Search.is_job_applied($stateParams.jobID);
                jobAdd.$promise.then(function(response) {console.log('Resource 1 data loaded!')});
                isApplied.$promise.then(function(response) {console.log('Resource 2 data loaded!')});

             return $q.all([jobAdd.$promise, isApplied.$promise]);
              }]       
             },       
    data: {
        requireLogin: true
    }        

 });
})

但是当注入控制器时它没有给出数据，页面似乎是空白的

我的控制器代码是

    .controller('JobaddController', function ($scope, $mdDialog, $state, jobAdd, Profile) {

        $scope.jobs = jobAdd[0];
        $scope.benifits = jobAdd[0].benifits;

        if($scope.jobs.short_listed == 1)
            $scope.jobs.flag = true;
        else
            $scope.jobs.flag = false;

        $scope.checkShortList= function(job){
            if(job.flag){
                Profile.rmShortList(job.short_list_id);
                job.flag = false;
            }
            else{
                if(job.short_list_id === null){ 
                     Profile.addNewShortList(job.id).then(function(response){
                        job.short_list_id = response.short_list_id;
                     });
                }
                else
                    Profile.addShortList(job.short_list_id,job.id);
                job.flag = true;
            }
        };


        $scope.companyModal = function(ev) {
        $mdDialog.show({
          controller: 'CompanyDetailsController',
          templateUrl: 'app/search/company-details.tmpl.html',
          parent: angular.element(document.body),
          targetEvent: ev,
        })
        .then(function(answer) {
          $scope.alert = 'You said the information was "' + answer + '".';
        }, function() {
          $scope.alert = 'You cancelled the dialog.';
        });
      };


        $scope.applyModal = function(ev) {
        $mdDialog.show({
          controller: 'ApplyController',   
          templateUrl: 'app/search/apply.tmpl.html',
          locals: { Jobid: $scope.jobs.id },
          parent: angular.element(document.body),
          targetEvent: ev,
          resolve: {
                    shortProfile: ['Profile', function(Profile) {
                       return Profile.shortProfile();
                        }]
                    },                       
        })
        .then(function(answer) {
          $scope.alert = 'You said the information was "' + answer + '".';
        }, function() {
          $scope.alert = 'You cancelled the dialog.';
        });
      };



         var container = angular.element(document.getElementById('container'));
        var section2 = angular.element(document.getElementById('section-2'));

        $scope.toTheTop = function() {
          container.scrollTop(0, 5000);
        };

        $scope.toSection2 = function() {
          container.scrollTo(section2, 0, 1000);
        };



    })

在服务代码中

    .service('Search', [ '$http', '$q', 'API',
    function($http, $q, API) {

        var data = '';
        this.jobAdd =  function(job_id) {
            var def = $q.defer();
            $http({
                url: API.url+'get_job_add_detail?job_id=' + job_id,
                method: "GET"
                }).success(function(response) { 
                    if(response.status == 'Success'){
                        data = response.data;
                        def.resolve(data);
                    }   
             }).error(function(response) {
                    console.log (response); 
                    if(response.status == 'Failed'){
                        data = response.msg;
                        def.reject(data);   
                    }
            });
            return def.promise;
        }


         this.isJobApplied =  function(job_id) {
            var def = $q.defer();
            $http({
                url: API.url+'is_job_applied?job_id='+job_id,
                method: "GET",
                }).success(function(response) { 
                    if(response.status == 'Success'){
                        data = response.data;
                        def.resolve(data);
                    }   
             }).error(function(response) {
                    console.log (response); 
                    if(response.status == 'Failed'){
                        data = response.msg;
                        def.reject(data);   
                    }
            });
            return def.promise;
        }
    }]);

这里有什么问题？如何在$ state resolve中附加多个服务？

Answer 1

您可以使用多种服务。

resolve: {   
            jobAdd: ['Search', '$stateParams', function(Search,$stateParams) {                   
                        return Search.jobAdd($stateParams.jobID);
                    }],
            isApplied: ['Search', '$stateParams', function(Search,$stateParams) {                   
                        return Search.isJobApplied($stateParams.jobID);
                    }]      
}

如何在$ state解析中加载多个服务？

1 个答案: