Question

我的AngularJS应用程序需要服务器中的一些元数据才能初始化控制器和一些指令。我有一个服务来返回数据，但无法获得控制器和指令等待数据。

myapp.factory("db",["$http",function($http)
{
  var db = {};

  db.metadata = function(callback)
  {
    $http.jsonp("/db/?f=metadata&callback=JSON_CALLBACK").success(function(data)
    {
      callback(data);
    }).error(function(error)
    {
      console.log(error);
    });
  }
  ...
  return db;
}]);


var myctrl = myapp.controller("MyCtrl",["$scope","$location","db",function($scope,$location,db)
{
  db.metadata(function(data)
  {
    $scope.metadata = data;
    // initialize $scope members with $scope.metadata for directives
     ...
  });
}]);

这显然不起作用，因为在调用db.metadata（）之前，指令将尝试使用未定义的$ scope成员进行初始化。我尝试过使用$ routeProvider resolve属性：

myapp.config(["$routeProvider",function($routeProvider)
{
  $routeProvider.when("/",{
    templateUrl: "./myview.html",
    controller: "MyCtrl",
    resolve: {
      metadata: ["db","$q",function(db,$q)
      {
        var deferred = $q.defer();

        db.metadata(function(data)
        {
          deferred.resolve(data);
        });

        return deferred.promise;
      }]
    }
  });
}]);

var myctrl = myapp.controller("MyCtrl",["$scope","$location","db","metadata",function($scope,$location,db,metadata)
{
  $scope.metadata = metadata;
  // initialize $scope members with $scope.metadata for directives
  ...
}

这不会运行，因为注入数组中的“元数据”的缩小友好声明会导致Angular呕吐。删除声明会导致注入的元数据未定义。我做错了什么？

Answer 1

问题原来是html仍有

<div ng-controller="MyCtrl">

这是不需要的，因为“MyCtrl”通过$ routeProvider配置为myview.html分配了控制器。

Angular JS延迟控制器和指令初始化，直到从服务器返回数据

1 个答案: