javascript - 如何延迟特定 Controller (不是路由)的实例化？

Question

我想要一个指令，它的行为与典型的 ng-controller 一样，但我希望它在 promise 被解决后被调用，而不是更早。 在 HTML 中，可以这样写:

<div ng-controller="myCtrl" ctrl-promise="p">

p 可以是对父作用域的任何 promise 。 我知道有一种方法可以延迟路由 Controller 的实例化(如此处回答:Angular.js delaying controller initialization)，但我更愿意为每个 Controller 而不是每个路由指定它。 我知道我可以将 ng-if 与 p 作为属性一起使用，但还有其他方法吗？

Answer 1

所以你希望 div 中的东西存在，只是没有 Controller 控制它，直到 promise 被解决？

这是一个指令，它将在 promise 被解决时创建一个 Controller :

angular.module('myApp')
.directive('delayController', function($controller, $q) {
  return {
    scope: true,
    link: function(scope, elm, attr) {
      $q.when(scope.$parent.$eval(attr.delayControllerPromise)).then(function() {
        var ctrl = $controller(attr.delayController, {
          $scope: scope
        });
        elm.children().data('$ngControllerController', ctrl);
      });
    }
  };
});

你可以这样使用它:

<div delay-controller="MyCtrl" delay-controller-promise="myPromiseExpr()">
</div>