Question

无法找到指令'appContent'所需的控制器'appLeft'！

//app-nav(left)
    app.directive('appLeft', function ()
    {
        return {
            restrict: 'E',
            replace: false,
            scope: {
                leftItem: "=leftItem"
            },
            controller:function($scope){
                this.title = $scope.leftItem;
            },
            templateUrl: 'res/tpl/app-left.html',
            link: function (scope, ele, attr)
            {
                scope.toggle=function(index){
                    scope.leftItem[index].isShow = !scope.leftItem[index].isShow;
                }
            }
        }
    });
    //app-content
    app.directive('appContent',function(){
        return {
            require:'^appLeft',
            restrict: 'E',
            replace:false,
            transclude:true,
            scope:{},
            templateUrl:'res/tpl/app-content.html',
            link:function(scope,ele,attr,appLeftCtrl){
                console.log(appLeftCtrl.title)
            }
        }
    });

无法找到指令'appContent'所需的控制器'appLeft'！

Answer 1

确保您的必需指令在html DOM中的child指令之外，因为appLef指令是父指令。

<app-left>
     <app-content></app-content>
</app-left>

根据Doc

当指令使用require时，$ compile将抛出错误，除非找到指定的控制器。 ^前缀意味着该指令在其父节点上搜索控制器（没有^前缀，该指令将仅在其自己的元素上查找控制器）。

Demo

Angular指令 - 控制器未找到指令

1 个答案: