AngularJS – 如何使用动态子指令的指令

真的很挣扎着 – 已经尝试过我能想到的一切方式.希望有人可以帮忙.

我有一个指令,为我创建一个自定义控件的轮廓.自定义控件的中心部分将通过基于外部伪指令上的作用域变量的值的进一步动态生成的伪指令来表示.范围变量包含内部指令的名称.我这样做是因为我的页面将具有多个动态生成的元素,所有元素都具有通用的布局,但内容不同.

即我的外部指令的一个例子：

<div data-inner="{{inner}}">
    <!-- div content here --->
<div {{inner}} />

{{inner}}设置为另一个指令的名称 – 在这种情况下是搜索.因此,我的页面应该成为：

<div data-inner="search">
    <!-- div content here --->
<div search />

在较低div上的搜索也被该指令的内容所取代.

有任何想法吗？

UPDATE
这是一个基本的jsFiddle代表我的问题 – 注意第三个div不显示.

我创造了一个小提琴 here.

这些是指令.

<script type="text/ng-template" id="one">
    <div class="one"></div>
</script>
<script type="text/ng-template" id="two">
     <div class="two"></div>
</script>

这里你做动态加载

<div ng-repeat='template in inner' ng-include='template'></div>

看看这是否有助于您,并解决您的目的.我正在将每个指令变成一个模板,然后使用ng include

AngularJS – 如何使用动态子指令的指令

相关文章