angularjs – 在所有$http异步调用完成后加载路径模板/控制器

发布时间：2020-12-17 17:18:19 所属栏目：安全来源：网络整理

导读：目前,我有一个index.html,内容如下： div ng-controller="MainCntl" div ng-view/div/div ng-view根据路由URL加载“template1.html”或“template2.html”. “template1”由“Controller1”控制,“template2”由“Controller2”控制. 我想做的事情：只有在Ma

目前,我有一个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中)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!