AngularJS指令控制器需要父指令控制器？

发布时间：2020-12-17 08:37:45 所属栏目：安全来源：网络整理

导读：我可能会考虑这完全向后，但我想尝试做三个嵌套指令，让他们称之为：屏幕，组件和小部件。我想要小部件能够触发组件中的一些行为，这反过来在屏幕中触发一些行为。所以： .directive('screen',function() { return { scope: true,controller: function() { t

我可能会考虑这完全向后，但我想尝试做三个嵌套指令，让他们称之为：屏幕，组件和小部件。我想要小部件能够触发组件中的一些行为，这反过来在屏幕中触发一些行为。所以：

.directive('screen',function() {
    return {
        scope: true,controller: function() {
            this.doSomethingScreeny = function() {
                alert("screeny!");
            }
        }
    }
})

.directive('component',controller: function() {
            this.componentFunction = function() {
                WHAT.doSomethingScreeny();
            }
        }
    }
})

.directive('widget',require: "^component",link: function(scope,element,attrs,componentCtrl) {
            scope.widgetIt = function() {
                componentCtrl.componentFunction();
            };
        }
    }
})

<div screen>
    <div component>
        <div widget>
            <button ng-click="widgetIt()">Woo Hoo</button>
        </div>
    </div>
</div>

我可以要求在组件的链接fn使用require：“^组件”的父组件，但是如何进一步给组件控制器访问其包含的屏幕？

我需要的是组件中的WHAT，所以当你单击小部件的按钮，它警告“screeny！”。

谢谢。

这里有两种方法可以解决你的问题：

>因为你使用scope：true，所有范围原型继承。因此，如果你在$ scope而不是在屏幕控制器中定义你的方法，那么组件和小部件都可以访问函数doSomethingScreeny。
Fiddle。
>在组件上定义一个链接函数，并且需要：’^ screen’。在链接函数中，将screenCtrl保存为scope属性，然后可以在指令的控制器(inject $ scope)中访问它。
Fiddle。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!