Javascript 如何使ng视图等待XHR响应？

我试图让ng视图等待xhr请求。我有两个用于路由ng视图的控制器，第一个完全加载。但是另一个不能很好地呈现，因为xhr响应是在下载partial.html之后发生的。在客户端获得xhr响应之前，如何避免partial.html请求

您可以在下面看到路由配置的代码：

变量配置=[ “$routeProvider”， “$locationProvider”， functionrouteProvider，locationProvider{ routeProvider。当“/”时{ templateUrl:“/partials/hotelinfo.html”， 管理员：“HotelInfo” }.当“/service/dept/：id”时{ templateUrl:“/partials/department.html”， 财务总监：“部门” }.否则{ 重定向到：'/' }; locationProvider.html5Modetrue； } ]; 下面您可以看到获取xhr响应的控制器配置

---

不要从控制器调用$http.get，而是从$routeProvider上的resolve函数调用它并将其注入控制器。这将导致Angular在$http的承诺得到解决之前不会加载您的视图。

您可以使用routeProvider中的resolve来完成此操作。它回报了一个承诺。在该承诺得到解决之前，不会加载该视图。您可以在控制器中解决该承诺

有关更多信息，请参阅$routeProvider

var configuration = [
  '$routeProvider',
  '$locationProvider',
  function(routeProvider, locationProvider) {
    routeProvider.when('/', {
      templateUrl: '/partials/hotelinfo.html',
      controller: 'HotelInfo'
    }).when('/service/dept/:id', {
      template: '/partials/department.html',
      controller: 'Department',
      resolve: {
            deferred: function($q) {
                return $q.defer();
            }
        }
    }).otherwise({
      redirectTo: '/'
    });

    locationProvider.html5Mode(true);
  }
];


var Department = [
  '$scope',
  '$routeParams',
  'deferred',
  function (scope, routeParams, deferred) {
    http.get('/service/dept/' + routParams.id).success(function (data) {
      scope.data = data;
      deferred.resolve();
    });
  }
];

---

有没有关于如何做到这一点的例子？我是新来安格拉的这行吗？请注意，Department controller中的deferred中的参数没有在数组中声明，我使用这种方法是因为缩小了。我没有专门测试这段代码，但我做了一些非常类似的事情。resolve属性公开延迟注入。你试过了吗？deferred是未定义的注意，我必须在functionvar Department=['$scope'，'$routeParams'，'deferred'，function scope，routeParams，deferred{…}]之后声明所有类似字符串的参数；我懂了。我对代码做了一个更改，我相信这应该可以做到。

var configuration = [
  '$routeProvider',
  '$locationProvider',
  function(routeProvider, locationProvider) {
    routeProvider.when('/', {
      templateUrl: '/partials/hotelinfo.html',
      controller: 'HotelInfo'
    }).when('/service/dept/:id', {
      template: '/partials/department.html',
      controller: 'Department',
      resolve: {
            deferred: function($q) {
                return $q.defer();
            }
        }
    }).otherwise({
      redirectTo: '/'
    });

    locationProvider.html5Mode(true);
  }
];


var Department = [
  '$scope',
  '$routeParams',
  'deferred',
  function (scope, routeParams, deferred) {
    http.get('/service/dept/' + routParams.id).success(function (data) {
      scope.data = data;
      deferred.resolve();
    });
  }
];