防止外部组件标记被渲染

Question

我正在将组件导入我的页面：

<div>
<p>Here is my component:</p>
<my-component></my-component>
</div>

如何防止<my-component></my-component>的物理HTML呈现在标记中，而仅使用my-component模板中已声明的html？

现在我得到：

    <div>
    <p>Here is my component:</p>
    <my-component><div>This is the inner html</div></my-component>
    </div>

我想要的地方：

        <div>
        <p>Here is my component:</p>
        <div>This is the inner html</div>
        </div>

Answer 1

在组件定义中，您可以设置selector: '[my-component]'，并将其视为指令，即

<div my-component>This is the inner html</div>

然后组件标签将不会显示。