需要解释 ng-template 中的 let-* 指令答案

【问题标题】：Need explanation for let-* directives in ng-template需要解释 ng-template 中的 let-* 指令
【发布时间】：2021-05-13 03:33:26
【问题描述】：

我是 Angular 的新手，现在正在处理一些遗留代码。在一个组件中有一个带有 let 循环的表。在互联网上搜索它，但没有很好地理解它。

<ng-template #itemTmpl let-data let-element="element">
  <ng-container *ngIf="data === 'route'"> {{ currentRouteSubject.value.number }} </ng-container>
  <ng-container *ngIf="data === 'name'">
    <ng-container *ngIf="!editRouteScheduleMap.has(element.id)"> {{ element[data] }} </ng-container>
    <ng-container *ngIf="editRouteScheduleMap.has(element.id)">
      <input type="text" [(ngModel)]="editRouteScheduleMap.get(element.id).name" />
    </ng-container>
  </ng-container>
  <ng-container *ngIf="data === 'requiredBusAmount'">
    <ng-container *ngIf="!editRouteScheduleMap.has(element.id)"> {{ element[data] }} </ng-container>
    <ng-container *ngIf="editRouteScheduleMap.has(element.id)">
      <input type="text" [(ngModel)]="editRouteScheduleMap.get(element.id).requiredBusAmount" />
    </ng-container>
</ng-template>

你能解释一下这个let-data，let-element='element'，以及它是如何与源文件相关的

【问题讨论】：

标签： javascript node.js angular typescript single-page-application

【解决方案1】：

let-* 属性是 ng-template 的一个特性，它通过从上下文中获取变量的值来将变量注入到模板中。

<ng-template let-data="sometext">
      <span>{{data}}</span>
</ng-template>

也许您可以查看此article 以了解更多信息

【讨论】：