我想要一个可重用的自定义指令,并创建一个隔离范围,以便可以在任何地方使用它(只要使用者使用该指令定义的 API)。然后,我希望消费者能够轻松地混合和匹配适合主要可重用指令的不同可重用部件。
我正在处理的情况是一个下拉菜单。 main 指令将隔离范围并为整个下拉列表定义 API。内部指令将允许消费者选择是否需要打开菜单的按钮、打开菜单的搜索框/输入字段等。然后他们还可以选择使用什么菜单样式:
<dropdown items="..." selected-item="...">
<dropdown-button>(Transcluded button text here)</dropdown-button>
<dropdown-icon-list></dropdown-icon-list>
</dropdown>
父指令/ Controller 将处理内部部分的状态/通信(即按钮可能触发“打开”状态,并且列表将通过打开进行响应)。换句话说,父指令将为使用者提供一个定义行为并将范围与页面其余部分隔离的位置,而嵌套指令将根据其 Angular 色更改共享状态/响应共享状态的更改。
实际上,我通过在主“下拉”指令上使用隔离范围,然后使用嵌套指令继承范围(没有在嵌套指令上指定“范围:...”)来完成此工作。但是,在 Angular 1.2 中,情况发生了变化,父级的隔离作用域真正被隔离了——子级继承了父级指令之外存在的作用域,而不是共享其隔离的作用域。
Angular 的方法是什么来完成这样的事情?
我已经开始改造现有的代码,以便与嵌套的子级指令共享父级指令中的 Controller ,但是一旦我遇到子级指令需要监听共享更改的情况,我觉得这是错误的方法。范围...我能看到做到这一点的唯一方法是将回调函数从嵌套指令传递到共享 Controller 中,该 Controller 将绑定(bind)到 $scope.$on 方法。似乎低头走错了路。
最佳答案
AngularJS 提供了 3 种类型的前缀。
- “@”(文本绑定(bind)/单向绑定(bind))
- "="(直接模型绑定(bind)/双向绑定(bind))
- “&”(行为绑定(bind)/方法绑定(bind))
所有这些前缀都从指令元素的属性接收数据并提供指令之间的通信。请访问以下链接了解类似问题。
关于angularjs - 在 Angular 中与嵌套指令共享隔离范围,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20362927/