<ng-container>と<template>

ng-container Angular 2のドキュメントで言及されていますが、それがどのように機能するか、そしてユースケースは何であるかについての説明はありません。

ngPluralとngSwitchディレクティブで特に言及されています。

DOESは<ng-container>同じことを行う<template>、またはそれは、ディレクティブがそれらのいずれかを使用するために書かれたかどうかによって決まり？

ある

<ng-container *ngPluralCase="'=0'">there is nothing</ng-container>

そして

<template [ngPluralCase]="'=0'">there is nothing</template>

同じはず？

それらの1つをどのように選択しますか？

<ng-container>カスタムディレクティブでどのように使用できますか？

編集：現在、文書化されています

<ng-container> 救助へ

Angular <ng-container> は、Angular  がDOMに配置しないため、スタイルやレイアウトを妨げないグループ化要素です。

（...）

<ng-container> 角度パーサによって認識シンタックス要素です。ディレクティブ、コンポーネント、クラス、インターフェースではありません。これは、JavaScriptのifブロックの波括弧のようなものです。

  if (someCondition) {
      statement1; 
      statement2;
      statement3;
     }

これらの中括弧がないと、JavaScriptは、条件付きですべてのステートメントを単一のブロックとして実行する場合にのみ、最初のステートメントを実行します。 <ng-container> 満たす角度テンプレートに似て必要。

元の答え：

このプルリクエストによると：

<ng-container> ノードのグループ化に使用できる論理コンテナですが、DOMツリーでノードとしてレンダリングされません。

<ng-container> HTMLコメントとしてレンダリングされます。

したがって、この角度テンプレート：

<div>
    <ng-container>foo</ng-container>
<div>

この種の出力を生成します：

<div>
    <!--template bindings={}-->foo
<div>

したがって、アプリケーションng-containerで要素のグループを条件付きで追加する（つまりを使用*ngIf="foo"）が、それらを別の要素でラップしたくない場合に役立ちます。

<div>
    <ng-container *ngIf="true">
        <h2>Title</h2>
        <div>Content</div>
    </ng-container>
</div>

次に生成されます：

<div>
    <h2>Title</h2>
    <div>Content</div>
</div>

ドキュメント（https://angular.io/guide/template-syntax#!#star-template）は、次の例を示しています。次のようなテンプレートコードがあるとします。

<hero-detail *ngIf="currentHero" [hero]="currentHero"></hero-detail>

レンダリングされる前に、「砂糖抜き」されます。つまり、アスタリスク表記は表記に転記されます。

<template [ngIf]="currentHero">
  <hero-detail [hero]="currentHero"></hero-detail>
</template>

「currentHero」が真実である場合、これは次のようにレンダリングされます

<hero-detail> [...] </hero-detail>

しかし、次のような条件付き出力が必要な場合はどうでしょう。

<h1>Title</h1><br>
<p>text</p>

..そして、出力をコンテナにラップしたくない場合。

砂糖抜きバージョンを直接次のように書くことができます：

<template [ngIf]="showContent">
  <h1>Title</h1>
  <p>text</p><br>
</template>

そして、これはうまくいきます。ただし、現在はngIfにアスタリスク*の代わりに角かっこ[]を付ける必要があります。これは混乱を招きます（https://github.com/angular/angular.io/issues/2303）。

そのため、次のような別の表記法が作成されました。

<ng-container *ngIf="showContent"><br>
  <h1>Title</h1><br>
  <p>text</p><br>
</ng-container>

両方のバージョンで同じ結果が生成されます（h1およびpタグのみがレンダリングされます）。いつものように* ngIfを使用できるため、2番目の方法が推奨されます。

Imoのユースケースはng-container、カスタムテンプレート/コンポーネントではやりすぎになる単純な置換です。APIドキュメントでは、次のように述べています

ng-containerを使用して複数のルートノードをグループ化する

それがすべてのことだと思います。グループ化です。

ng-containerディレクティブが実際のコンテンツをラップするテンプレートではなく、ディレクティブが失われることに注意してください。

* ngIfおよび* ngForでテーブルを使用したい場合の使用例-divをtd / thに配置すると、テーブル要素が正しく動作しなくなります -。私はこの問題に直面し、それが答えでした。