使用angularjs组成多层视觉元素

Question

我希望使用angularjs构建自定义小部件。我的问题是我希望能够松散地耦合我的小部件。

就我而言，我希望构建一个两级组件：

• 图形微调器
• 将微调器作为argument。
的进度窗口小部件

我构建了微调器 - http://jsfiddle.net/Byg6W/

我希望将进度小部件编写为：

<gh:progress data="progress">
   <gh:spinner .... options ....> </gh:spinner>
</gh:progress>

以某种方式能够将两个组件“连接”在一起，这样当“数据”更新时，它会自动输入到gh：spinner，而不是我厌恶做的事情 - 为gh：spinner提供所有选项进入gh：进步

<gh:progress data="progress" .... options ....></gh:progress>

然后使用模板。

提前致谢！

Answer 1

你可以在你的gh：progress指令上创建一个由gh：spinner调用的控制器。你的gh：spinner可以将这个控制器注入到它的链接：function通过require：property请求它。在这里，你要在require中使用^来告诉它在父元素上寻找控制器。

请参阅http://docs.angularjs.org/guide/directive上的require：规范。

查看angularjs.org主页底部的Tabs示例，了解它的实际效果。这里，窗格指令需要父标签的控制器，以便它们可以注册并让标签控制它们之间的切换。