問題タブ [ng-container]

以下のサンプルでは、ng-template​​以下のように使用しており、正常に動作しています。

サンプルリンク:ここをクリック

しかし、コンテンツ用に新しいファイルを作成し、ng-templateそれを別のファイルで使用したいと考えています。私は以下のように試しましたが、うまくいきません。この場合の解決策を見つけるのを手伝ってください。

template.html

default.html

サンプル 2:サンプル 2

ref stackoverflow の質問: angular2 ng-template を別のファイルに

スタックオーバーフローは初めてで、Angular はかなり新しい - 中級レベルと言います。

したがって、* ngFor ループを使用して HTML テーブルの最初の 3 つの列を作成および入力するという問題があり、別の * ngFor 条件を使用して、firestore データベースからのドキュメントのコレクションをループして入力したいと考えています。特定の条件が満たされたテーブルの行から、コンテンツの 2 つのオプションのいずれかを適用するためにif条件を適用する最後の列まで。

言葉だけで説明するのは混乱するので、より良い絵を描くためのコードを次に示します。

HTML テーブルの作成に使用される JSON:

filteredReservations が firestore get リクエストによって返されるドキュメントのコレクションの配列である HTML テーブル:

期待される結果は、HTML テーブルが最初の *ngFor を使用して作成され、filteredReservations が条件が満たされた行に表示され、最後の列に編集アイコンが表示され、新しい予約を追加するか、既存の場所を編集するリンクが表示されることです。条件が満たされます。

私が目指していることを達成しようとすると、最後の列がコレクション内のドキュメントの数だけ繰り返されます。つまり、最後の列がfilteredReservationsループの外にある必要がありますが、予約データを使用してif条件を確認します。

目指しているもの：1

私が現在得ているもの：2

私はできる限り最善を尽くして説明しようとしたので、うまくいけばこれは理にかなっています。

nodeTemplateさて、これはテンプレートを子に渡そうとしている私の親コンポーネントですils-tree

子コンポーネントils-treeの HTML はこのように見えます

コントローラファイルには

基本的に、ps はどこにも見られず、はい、データjsonは正常に渡されています。ヘルプ！

PSテンプレートは、間に直接埋め込まれた場合に機能します。あれは、