AngularJS：在控制器收到所有数据后加载templateUrl

Question

我想在加载来自服务器的数据时显示我的模板。

我创建了一个名为Services的模块，里面有一些服务来加载我的数据，我对我的例子使用HomeService。

var app = angular.module('MyApp', ['Services']); 

app.config(['$routeProvider', function($routeProvider) { 
    $routeProvider 
     .when('/', 
     { 
      templateUrl: 'home.html', 
      controller: 'Home_Ctrl', 
      resolve: { 
       loadData: //?? 
      } 
     }); 
}]); 

app.controller('Home_Ctrl', ['$scope', 'HomeService', function($scope, HomeService) { 

    $scope.data = HomeService.getData(); 

} 

我想我需要创建一个承诺做到这一点。是否有可能把这个功能放在我的控制器里面？

我的意思是，我不希望这样的事情：

var ctrl = app.controller('Home_Ctrl', ['$scope', 'HomeService', function($scope, HomeService) { 
    //Do something 
} 

//Promise 
ctrl.fct = function($q) { 
} 

我想这样的事情：

app.controller('Home_Ctrl', ['$scope', '$q', 'HomeService', function($scope, $q, HomeService) { 

    //Do something 

    //Promise 
    this.fct = function() {} 
} 

任何想法？

谢谢。

Answer 1

您可以使用控制器的resolve属性。 您可以创建一个对象，它将在控制器定义返回的承诺，并分配到控制器的决心功能和注入相同的好心看的很简单的例子

$routeProvider.when('/ExitPoll', { 
     templateUrl: '/partials/ExitPoll.html', controller: exitpollController, resolve: { 
      responseData: ['$http', function ($http) { 
       return $http.get('/Candidate/GetExitPolls/hissar').then(function (response) { 
        return response.data; 
       }); 
      }], 

     } 
    }); 


var exitpollController = ['$scope', '$http','responseData','$rootScope', 
function ($scope, $http, responseData, $rootScope) { 
}];