使用angularjs组成多层视觉元素

时间:2012-12-13 02:36:39

标签: javascript angularjs

我希望使用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>

然后使用模板。

提前致谢!

1 个答案:

答案 0 :(得分:3)

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

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

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