角旋转指令被控制器加载后实例化 [英] Angular spinning directive gets instantiated after controller load

问题描述

我有一个控制器。下面是构造函数的相关部分（什么是此功能的正确的术语）：

I have a controller. Here is the relevant part of the constructor function (what is the correct term for this function?):

activate();

        function activate() {
            $scope.$broadcast('ctrlLoadingStarted');
                var promises = [getUsers()];
                return $q.all(promises).then(function (eventArgs) {
                    $scope.$broadcast('ctrlLoadingFinished');
            });
        }

因此​​，激活函数基本上是一个通用的函数，它在数据获取功能的阵列。它在广播开始和广播上完成。

So the activate function is basically a generic function that takes in an array of data getting functions. It broadcasts on start and broadcasts on finish.

然后，我有嵌套在控制器范围的指令，这里是指令的相关部分：

Then I have a directive nested in the controllers scope, here is the relevant part of the directive:

function link(scope, element, attrs) {
            scope.$on('ctrlLoadingStarted', function (event, args) {
                scope.spinnerOn = true;
            });
            scope.$on('ctrlLoadingFinished', function (event, args) {
                scope.spinnerOn = false;
            });
        }

正如你所看到的，它只是简单地听着起点和终点事件，并开启一个微调和关闭。

As you can see, it is simply listening to the start and finish events and turning a spinner on and off.

的问题是，所述控制器，似乎该指令之前被实例化。这导致在广播持续关闭和不转动的旋转器。

The issue is that the controller seems to be instantiating before the directive. This results in the broadcast going off and not turning the spinner on.

我想干脆把 scope.spinnerOn = TRUE; 在该指令的第一行（这样一来，无论何时控制器实例相对于指令的实例化，微调会一直走下去）。但是，我遇到了在那里的问题是控制器的第二广播会出去的指令被实例化，以及之前引起无休止的微调。

I tried to simply put scope.spinnerOn = true; in the first line of the directive (this way, no matter when the controller instantiates relative to the directive instantiation, the spinner will always go on). However, the problem I ran into there was that the controller's second broadcast would go out before the directive was instantiated as well causing an endless spinner.

我只是想确保在控制器的指令之前实例但随后的数据越来越需要一段时间的微调会旋转。

I just want to ensure that if the controller instantiates before the directive but then the data-getting takes a while that the spinner will spin.

所有的建议是AP preciated，先谢谢了。

All advice is appreciated, thanks in advance.

推荐答案

触发$超时激活功能。

function activate() {
            $scope.$broadcast('ctrlLoadingStarted');
                var promises = [getUsers()];
                return $q.all(promises).then(function (eventArgs) {
                    $scope.$broadcast('ctrlLoadingFinished');
            });
        }

$timeout(activate)

通过这个激活功能将被调用在明年消化周期。

With this the activate function will be called in next digest cycle.

更多关于消化周期集成浏览器事件循环在部分：的 https://docs.angularjs.org/guide/scope

More about Digest cycle Integration with the browser event loop section at: https://docs.angularjs.org/guide/scope

的免责声明：这是我的JavaScript /浏览器是如何工作的理解。这可能是不正确的。的

这篇关于角旋转指令被控制器加载后实例化的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！