介绍 'ng-container'

ng-container 是 Angular 中的一个特殊指令，它不会向 DOM 中添加元素，而是充当一个占位符。 ng-container 通常用于解决要渲染多个元素但包裹在一个共同父元素下的问题，例如当通过 *ngFor 循环来渲染列表或者表格时。

用法

ng-container 可以和其他指令一起使用，如 *ngIf ， *ngFor 或 ngTemplateOutlet。

<ng-container [ngTemplateOutlet]="someTemplate"></ng-container>

在上面的例子中， ng-container 的 ngTemplateOutlet 属性被设置为一个模板引用，该模板将被渲染。 然而，在这种情况下， ng-container 并没有在 DOM 中添加任何实际元素。这使得我们可以使用模板来渲染元素，而不会受到父元素的限制。

优点

使用 ng-container 有以下几个好处：

• 可以避免出现额外的 DOM 元素，从而保证性能。
• 可以提升可读性和可维护性，让代码更加简洁。

总结

ng-container 是一个非常有用的指令，它可以用于解决很多常见的问题。 通过将其与其他指令和模板一起使用，可以大大提高 Angular 应用程序的可读性和可维护性，同时还可以提高性能。 无论您是在创建新的 Angular 应用程序，还是在维护现有的应用程序， ng-container 无疑是您需要掌握的一个重要工具。

参考

• Angular ng-container Usage and Examples