9

真的在为此苦苦挣扎 - 尝试了我能想到的所有方法。希望有人可以提供帮助。

我有一个指令可以为我创建自定义控件的轮廓。自定义控件的中心部分将由另一个动态生成的指令表示，该指令基于外部指令上的范围变量的值。范围变量包含内部指令的名称。我这样做是因为我的页面将有多个动态生成的元素，它们都有一个共同的布局但不同的内部内容。

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

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

{{inner}}设置为另一个指令的名称 - 在这种情况下search。因此，我的页面应变为：

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

在search较低的 div 上也被该指令的内容替换。

有任何想法吗？

更新 这是一个代表我遇到的问题的基本jsFiddle - 注意第三个 div 没有显示。

4

2 回答 2

14

我在这里创建了一个小提琴。

这些是指令。

<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

于 2013-02-01T14:37:15.503 回答
3

试试这个小提琴http://jsfiddle.net/xpKwb/12/

您可以使用 ngSwitch

<div ng-repeat='template in inner'>
    <div ng-switch on="template">
        <div ng-switch-when="one">
            <div class='one'></div>
        </div>
        <div ng-switch-when="two">
            <div class='two'></div>

        </div>
    </div>
于 2013-05-26T21:39:23.010 回答