javascript - Syntaks for *ngFor når du itererer innenfor en allerede iterert samling i Angular 2-app


Jeg prøver å finne ut hvordan jeg kan bore ned for å iterere over en matrise som er innenfor en annen samling av matriser i en Angular 2-app. I komponenten min abonnerer jeg på en observabel slik i Angulars ngOnInit livssyklus-hook:

ngOnInit() {
    const records = this.filtersService.getByFilter(this.page, this.pagesize, {
            'services.workflow.status' : 'client information'
            })
            .subscribe(resRecordsData => {
                this.records = resRecordsData;
                console.log(this.records);
            },
            responseRecordsError => this.errorMsg = responseRecordsError);
}

Så, etter min mening, itererer jeg over et array av "data" som returneres med "records", slik:

<tr *ngFor="let record of records.data">

Deretter, innenfor den "records.data" arrayen henter jeg informasjon fra den første arrayen innenfor "services" og sender det gjennom et par rør før jeg skriver det ut på skjermen, slik:

        <td> 
            <span *ngIf="record?.services[0]?.workflowFlags?.action>
                {{record?.services[0]?.workflowFlags?.action | lowercase | flagAbbreviate | capitalize}}
            </span>

Alt ovenfor fungerer som forventet.

Det jeg ønsker å gjøre er, i stedet for å bare sjekke den første verdien, å iterere over en matrise av «tjenester» og returnere de som finnes. Det jeg er usikker på, er hvordan man bruker «*ngFor»-direktivet når man dykker ned i en samling som man allerede itererer over med en *ngFor.

Jeg prøvde å gjøre dette:

            <td *ngFor="let service of services"> 
                <span *ngIf="service?.workflowFlags?.action">
                            {{service?.workflowFlags?.action | lowercase | flagAbbreviate | capitalize}}
                </span>

... Men, selv om jeg ikke får noen feil, får jeg heller ingen resultater. Hvordan kan jeg bruke *ngFor her for å iterere over et array med samlingen jeg allerede itererer over i denne visningen?

Svar #1

Burde ikke dette:

<td *ngFor="let service of services"> 

være dette:

<td *ngFor="let service of record.services"> 

Relaterte artikler