内HTML的ng-容器，角4？

Question

我希望在我的html代码中动态放置html代码，因此我编写了以下代码：

<ng-container [innerHTML]="buttonIcon"></ng-container>

innerHTML说ng-container不是有效的属性

我不想像下面这样使用第三个html标记：

<div [innerHTML]="buttonIcon"></div>

那么，在没有任何标记内部html绑定的情况下，如何插入html代码呢？

Answer 1

您可以使用ngTemplate：

<ng-template #buttonIcon>
    <div> Your html</div>
</ng-template>
<ng-container 
   *ngTemplateOutlet="buttonIcon">
</ng-container>

Answer 2

[outerHTML]

来代替外部元素。

在你的情况下

<div [outerHTML]="buttonIcon"></div>

确实，有一个干净的HTML结构对于保持CSS规则尽可能简单是很重要的。

Answer 3

**请阅读评论。这个答案可能是错的。我不知道，没有再调查过**

ng-container不被呈现为html，它只是一个结构指令。

角是一个分组元素，它不会干扰样式或布局，因为角不会将其放入DOM中。

因此，没有可以将html放入的元素。你得和个潜水员合作。如果您认为不需要一个子div，那么您很可能也可以将ng-container替换为div本身，而根本不使用容器。