Angular 无论如何都要重复使用<；ng模板>；

我的角度分量看起来像这样

<p-listbox>
  <ng-template let-item pTemplate="item">
    <mat-icon>find_in_page</mat-icon> {{item.name}}
  </ng-template>
</p-listbox>

<p-listbox>
  <ng-template let-item pTemplate="item">
    <mat-icon>find_in_page</mat-icon> {{item.name}}
  </ng-template>
</p-listbox>

在页面{{item.name}中查找}
在页面{{item.name}中查找}

我有两个列表框（），每个都有相同的模板来呈现列表项。 现在我在每个标记中都有重复的代码

---

是否有任何方法可以减少代码并重用为列表项集中定义的组件

组件技术

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
@Component({
  selector: 'app-plist-component',
  templateUrl: './plist-component.html',
  styleUrls: ['./plist-component.scss'],
})
export class PlistComponent implements OnInit {
 @Input item:any

}

component.html

<p-listbox>
  <ng-template let-item pTemplate="item">
    <mat-icon>find_in_page</mat-icon> {{item.name}}
  </ng-template>
</p-listbox>

在页面{{item.name}中查找}

用法：

<app-plist-component [item]="item"></app-plist-component>

---

另一种选择。可能不是你想要的，但你可以循环它们

<p-listbox *ngFor="let item of [{name:'Fred'},{name:'Joe'}]">
  <ng-template let-item pTemplate="item">
    <mat-icon>find_in_page</mat-icon> {{item.name}}
  </ng-template>
</p-listbox>

在页面{{item.name}中查找}

答案就是使用嵌套的

查找页面{{item.value}

您是否可以检查

ngTemplateOutLet

您可以创建一个新组件，将上面的代码片段移动到该组件，然后根据需要调用该组件。@user1608841使用ngTemplateOutLet不起作用。我们需要一种方法来插入inline@ShivamGupta有什么具体原因吗？为什么它不起作用？你甚至可以将contect传递给ngtemplateoutlets，如果我把列表框堆叠在一起，那就太酷了。但事实并非如此。你是在用*nggo-me来思考是否有办法使用其他简单的结构元素。还有其他想法吗？这是一种在一次性情况下快速减少代码的绷带。为什么不创建一个小组件呢？基本代码添加到我的答案中。我有相当多的输入项/以及输出处理程序。我不确定创建嵌套组件会如何影响性能。我已经回答了自己的问题。你可以看看。当我不再努力寻找时，答案恰到好处：D

<p-listbox>
  <ng-template let-item pTemplate="item">
    <ng-container *ngTemplateOutlet="templatePItem; context: {$implicit: item}">
    </ng-container>   
  <ng-template>
</p-listbox>

<ng-template #templatePItem let-item>
  <!-- Define your template for the item -->
  <mat-icon>find_page</mat-icon> {{item.value}}
</ng-template>