Angular：加载所有指令时在控制器中运行函数

Question

我正在尝试编写一些代码，允许我在控制器中运行一个函数，但只有在整个 dom 设置并准备好后（包括指令链接函数运行等）。

我目前正在通过 $rootScope 广播在 ctrl/service 和指令之间进行通信。指令未接收到控制器加载时的第一次广播。原因当然是控制器在指令链接函数运行之前加载。我已经阅读了一些关于 SO 的类似问题，人们建议在这些电话中使用 $timeout。不幸的是，这并不总是有效，我不想用大量的 $timeout 调用来弄乱我的 ctrl/服务。因此，我正在寻找另一种解决我的问题的方法。

通信模式如下：

1.) 控制器告诉服务准备一些数据（通过服务中的函数调用）

2.) 服务告诉指令显示数据（通过广播）

3.) 指令显示数据...或者在我的情况下不显示数据:(

编辑：

由于在我的应用程序中计时是必不可少的，我基本上是在寻找一种在所有角度组件完成加载后立即在控制器中启动功能的方法。控制器中的该函数将通过为范围变量分配值来显示内容。同时它会开始花时间。我当然只能在加载指令后开始这样做，否则 tmining 错误或指令尚未准备好显示内容等。

我已经阅读了 Ben Nadel 的一篇博文，它基本上展示了指令是如何加载的。我希望设置一个最后加载的外部指令，这样我就可以从那里触发完成的加载。不幸的是，一旦任何内部指令使用 templateUrl，这将不起作用。 http://www.bennadel.com/blog/2603-directive-controller-and-link-timing-in-angularjs.htm

Answer 1

使用 $timeout 会很糟糕。不要那样做。您无法定义服务器调用需要多长时间。

我会推荐使用这种模式：

• 让控制器使用服务来加载一些数据，并让 控制器中的 promise 将返回数据分配给范围变量。
• 将该范围变量传递到您的指令中。
• 在指令链接函数中设置一个监视，当它加载时，它将从未定义变为所需值。完成！

// 在你的控制器中

YourService.all().then(function(data) {
  $scope.data = data;
});

//在你看来

<some-directive your-data="data"></some-directive>

// 在你的指令中

angular.module('blah.directives').directive('someDirective', function() {
    return {
      scope: {
        yourData: '='
      },
      link: function(scope, element, attrs) {

        var watcher = scope.$watch('yourData', function() {
          if(scope.yourData === undefined) return;

          // at this point your data will be loaded, do work

          // optionally kill watcher at this point if it's not going to update again
          watcher();
        });
      }
    }
  });