申告方法動的 テンプレート参照変数要素内ですかngFor?
ng-bootstrap のポップオーバー コンポーネントを使用したいのですが、ポップオーバー コード (Html バインディング付き) は次のようになります。
<ng-template #popContent>Hello, <b>{{name}}</b>!</ng-template>
<button type="button" class="btn btn-secondary" [ngbPopover]="popContent" popoverTitle="Fancy content">
I've got markup and bindings in my popover!
</button>
どうやって包む内部の要素はngFor？
<div *ngFor="let member of members">
<!-- how to declare the '????' -->
<ng-template #????>Hello, <b>{{member.name}}</b>!</ng-template>
<button type="button" class="btn btn-secondary" [ngbPopover]="????" popoverTitle="Fancy content">
I've got markup and bindings in my popover!
</button>
</div>
うーん...何か考えはある？
ベストアンサー1
テンプレート参照変数のスコープは、定義されているテンプレートに限定されます。構造ディレクティブはネストされたテンプレートを作成するため、別のスコープが導入されます。
テンプレート参照には1つの変数だけを使用できます
<div *ngFor="let member of members">
<ng-template #popupContent>Hello, <b>{{member.name}}</b>!</ng-template>
<button type="button" class="btn btn-secondary" [ngbPopover]="popupContent" popoverTitle="Fancy content">
I've got markup and bindings in my popover!
</button>
</div>
すでに宣言されているので動作するはずです<ng-template ngFor
詳細については以下も参照してください: