javascript - 如何获得包含和替换另一个指令的角度指令？

Question

我有一个 AngularJS 指令，directiveFoo由一个属性实例化：

<div directiveFoo></div>

我希望我directiveFoo总是实例化另一个指令，例如模板是：

<div directiveBar="123"></div>

我的问题是——这是否可以在不创建所有浪费的节点的情况下完成？我想添加replace到我的指令中，但随后它就消失了directiveFoo

我最终想要的是：

<div directiveFoo directiveBar="123"></div>

连接了两个控制器。

这是一个简化的例子。我试图防止：

<div directiveA>
    <div directiveB>
        <div directiveC="123">
            <div directiveD></div>
        </div>
    </div>
</div>

在我真的不需要所有嵌套的 DOM 节点的情况下

score 3 · Accepted Answer

但随后它吹走了directiveFoo

它不应该。“替换过程将所有属性/类从旧元素迁移到新元素。”——指令文档

由于属性已迁移，directive-foo因此应显示在生成的 HTML 中。

app.directive('directiveFoo', function() {
    return {
        template: '<div directive-bar="123">bar</div>',
        replace: true,
    }
});

上述指令产生以下 HTML（在 Chrome 中测试）：

<div directive-bar="123" directive-foo>bar</div>

在小提琴中，我还为每个指令创建了一个控制器（因为你提到你想要那个），我展示了directive-bar可以访问directive-foo的控制器。

（我把bar文本放在模板中，只是为了更容易右键单击它并选择“检查元素”）。

1 回答 1