目前,我有一个index.html,内容如下：
<div ng-controller="MainCntl">
<div ng-view></div>
</div>
ng-view根据路由URL加载“template1.html”或“template2.html”. “template1”由“Controller1”控制,“template2”由“Controller2”控制.
我想做的事情：只有在MainController内的所有异步调用完成后才加载URL映射内容(使用$routeProvider).
任何建议都将受到高度赞赏.
解决方法
AngularJS路由有一个用于此目的的属性,即resolve属性：
window.angular.module('app',[])
.config(['$routeProvider',function($routeProvider) {
$routeProvider
.when('/',{
templateUrl: 'afterDoingSomething.html',controller: 'appCtrl',resolve: {
// function that returns a promise
}
})
.otherwise({
redirectTo: '/'
});
}])
这样,只有在返回的promise被解析后才会加载视图.
试图解释这一点是没有意义的,当egghead解释它时,那么好：
> On promisses
> The resolve function
> A More pratical application
请记住,任何$http或$resource调用都将返回这些promisses,因此您不必直接使用它们(返回$http(…)也可以正常工作 – 或者您可以将许多$http调用合并到一个promise中)
