Question

以下是jsfiddle.net举例说明我的情况。

app=angular.module("app",[]);

app.directive("submitForm",function(){
    return{
        scope:{},
        restrict: 'A',
        controller:function($scope, $element){
            $scope.submitted=false;

            this.submit=function(){
                $scope.submitted=true;
            };
            this.getSubmit=function(){
                return $scope.submitted;
            };
            this.submitOn=function(){
                return $scope.$broadcast("submitOn");
            };
        },
        link: function(scope, element, attrs,ctrl){
            element.find("button").on("click",function(){
                scope.submitted=true;
                ctrl.submitOn();
            });
        }
    }
})
.directive('errorRender',function(){
    return{
        restrict: 'A',
        //scope: {},
        require:['ngModel','^submitForm'],
        controller: function($scope, $element){
            $scope.$broadcast("requireErrorEnable");

            $scope.$broadcast("requireErrorDisable");

            $scope.$broadcast("maxlengthErrorEnable");

            $scope.$broadcast("maxlengthErrorDisable");
        },
        compile: function compile(tElement, tAttrs) {

            return function postLink(scope, element, attrs, ctrl) {
                modelCtrl=ctrl[0];
                formCtrl=ctrl[1];

                scope.$on("submitOn",function(){
                    alert("submitOn!!!");
                });

                scope.$on("requireErrorEnable",function(){
                    element.attr("placeholder","error");
                });

                scope.$on("requireErrorDisable",function(){
                    element.attr("placeholder","");
                });

                scope.$watch(function(scope){
                        return ctrl[0].$error.required;
                    },
                    function(newValue, oldValue, scope){
                        if(ctrl[0].$error.required){
                            if((ctrl[0].$dirty && !ctrl[0].$viewValue)){
                                scope.$emit("requireErrorEnable");
                            }
                        }else{
                            scope.$emit("requireErrorDisable");
                        }
                    });
            }
        }
    }
});

如果我在隔离范围内使用指令 errorRender ，在这种情况下我无法触发指令控制器的函数 submitForm 。否则所有指令 errorRender 会同时触发（正如我们所期望的那样）。

Answer 1

指令可以通过您正确指定的require属性共享控制器。这是Angular's docs指令关于访问指令控制器的说法（强调添加）：

“require - 需要另一个指令，将其控制器作为链接函数的第四个参数。需要一个字符串名称（或字符串数组）传入的指令。如果使用数组，注入的参数将是一个相应顺序的数组。如果没有找到这样的指令，或者指令没有有一个控制器，然后出现错误“

恕我直言，当你应用于你的情况时，这意味着注入控制器的链接函数是你的child指令中的一个，而不是父指令

当辅助指令具有隔离范围时，是否可以从父指令控制器调用函数

1 个答案: