javascript - Behöver förklaring för let-* direktiv i ng-template


Jag är nybörjare i Angular och just nu arbetar jag med lite gammal kod. I en komponent finns det en tabell med let-loop. Sökte efter det på internet men förstod det inte riktigt.

<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>

kan du förklara för mig detta let-data, let-element='element', och hur det är kopplat till källfilen

Svar #1

Let-*-attributet är en funktion hos ng-template för att injicera en variabel i mallen genom att hämta variabelns värde från kontexten.

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

Kanske kan du läsa den här artikeln för att förstå mer om detta

Relaterade artiklar