指令继承和互操作性

Angular js 指令可以嵌套或可互操作。

在这个例子中，指令 Adir 向指令 Bdir 公开它的控制器$ scope，因为 Bdir 需要 Adir。

angular.module('myApp',[]).directive('Adir', function () {
        return {
            restrict: 'AE',
            controller: ['$scope', function ($scope) {
                    $scope.logFn = function (val) {
                            console.log(val);
                        }
                  }]
            }
    })

确保设置 require：’^ Adir’（查看角度文档，某些版本不需要^字符）。

.directive('Bdir', function () {
        return {
            restrict: 'AE',
            require: '^Adir', // Bdir require Adir
            link: function (scope, elem, attr, Parent) { 
            // Parent is Adir but can be an array of required directives.
                elem.on('click', function ($event) {
                    Parent.logFn("Hello!"); // will log "Hello! at parent dir scope
                    scope.$apply(); // apply to parent scope.
                });
            }
        }
    }]);

你可以通过以下方式嵌套指令：

<div a-dir><span b-dir></span></div>
<a-dir><b-dir></b-dir> </a-dir>

不要求指令嵌套在 HTML 中。