为什么嵌套指令 Controller 和 Link 函数触发顺序取决于模板和 templateUrl？

Question

我正在使用 AngularJs 1.4.8，我注意到了奇怪的行为：

当你有 2 个指令时：

angular.module('another-module', [])
            .directive('anotherModuleOuter', function () {
                return {
                    scope: {},
                    controller: function () {
                        console.log('another-module-outer - controller');
                    },
                    link: function () {
                        console.log('another-module-outer - link');
                    },
                    template: '<div>another-module-outer <div another-module-inner></div></div>'
                }
            })
            .directive('anotherModuleInner', function () {
                return {
                    scope: {},
                    controller: function () {
                        console.log('another-module-inner - controller');
                    },
                    link: function () {
                        console.log('another-module-inner - link');
                    },
                    template: '<div>another-module-inner</div>'
                }
            });

你会得到

another-module-outer - controller
another-module-inner - controller
another-module-inner - link
another-module-outer - link

意味着外部指令的控制器将首先被调用，link 函数 - 最后。

但是，如果您更改 inner 的模板：

template: '<div>another-module-inner</div>'

到 templateUrl 如：

templateUrl: 'anotherModuleInner.html'

加载顺序也会改变（外部指令的 link 将在内部控制器之前触发）：

another-module-outer - controller
another-module-outer - link
another-module-inner - controller
another-module-inner - link

为什么会这样？

P.S/

我在处理内部指令注册 $scope.$on() 和外部触发 $rootScope.$broadcast() 的事件时遇到问题，但由于内部函数 $on 在广播后注册，所以它没有捕捉到任何东西.如果您提出解决方案，我将不胜感激。

Answer 1

您正在寻找的答案在 $compile for templateUrl

下的文档中

Because template loading is asynchronous the compiler will suspend compilation of directives on that element for later when the template has been resolved. In the meantime it will continue to compile and link sibling and parent elements as though this element had not contained any directives.

为什么嵌套指令 Controller 和 Link 函数触发顺序取决于模板和 templateUrl？

Why does nested directives Controller and Link functions trigger order depend on template and templateUrl?

javascript

event-handling

angularjs