Question

我知道有一个可折叠的指令可用作UI Bootstrap的一部分，但我想创建自己的指令（为了学习如何编写指令; - ））。

现在我有一点概念问题。

最后，我想要的是：

<collapsible collapsed>
  <title>foo</title>
  <body>
    [...]
  </body>
</collapsible>

该指令应该创建组件并显示它。到现在为止还挺好。我没有得到的是如何访问两个包含的部分title和body。我看到有ng-transclude，但这会返回完整的内容。

如果我有两个单独的内容，如本例所示，该怎么办？

Answer 1

两个单独的内容意味着您必须从您的指令访问/修改DOM。

一些提示（没有完整的解决方案，因为你想“自己编写”;）

您还可以查看egghead.io上有关angular.element的视频25。不是你问题的确切解决方案，但有些类似。

Answer 2

您可以使用一些简单的jQuery方法来遍历$element内的dom，但是您不会监听更改，因此如果异步更改此内容，您的小部件（可能）将不会反映这些更改。

相反，你最好为每个属性手动编译$ compile（自定义ng-transclude）并将其注入你想要的地方，但是有很多变量很难给你一个具体的答案。