使用 ng-container 与模板的好处？答案

【问题标题】：Benefit of using ng-container vs. template?使用 ng-container 与模板的好处？
【发布时间】：2019-05-30 11:14:33
【问题描述】：

在角度我们可以这样做：

template: `<ng-container #c></ng-container>`

或：

template: `<template #c></template>`

创建一个在模板渲染时隐藏的视图容器。

使用ng-container 与替代html 模板有区别吗？我猜 Angular 必须拥有自己的模板容器，例如 ng-template 或 ng-container，因为使用原始的 html 模板元素可能会破坏非基于浏览器的运行时，例如移动客户端等。

【问题讨论】：

谁将此问题标记为主要基于意见？它不是。它们之间存在差异。第一个区别是 template Angular 中的 HTML 标记等价于 ng-template 而不是 ng-container。而且ng-container和ng-tempate也有区别
@quirimmo OP 使用了“好处”这个词，这往往会吸引固执己见的答案。所以我编辑了这个问题:)

【解决方案1】：

<ng-container> 总是被渲染，但不代表 DOM 元素。它仍然附加到组件的视图中。

<ng-template> 只有在明确请求时才会呈现。

这里有一个很好的参考：

创建一个在模板渲染时隐藏的视图容器。

尽可能使用<ng-template>。 <ng-container> 用于将 DOM 元素组合在一起。例如;当您需要将*ngIf 应用于许多<td> 元素时，因为您不能在<td> 周围使用<span>。

【讨论】：

ng-template 会在您使用模板变量时呈现，例如 <ng-template #test>
@quirimmo 引用变量时不会渲染吗？
这就是我所说的“模板变量”。我认为即使您发布的链接状态相同，sn-ps 中有一个专门的示例
@Ole 当您希望 <template> 表现得像一个普通的 HTML 元素时，这将是一个问题。例子;如果您使用了使用 <template> 的第三方库，那么您无法阻止 Angular 使用它。所以拥有<ng-template> 会更好，因为Angular 会将它从DOM 中移除并替换为注释。
@Ole <template #c> 将使 c 变为 ElementRef，而 <ng-template #c> 将使 c 变为 TemplateRef。您不能将 ElementRef 传递给视图工厂方法。他们需要一个 TemplateRef。