html - Använda Typescript-variabel för att skapa img src

Jag har en array som innehåller en lista över kategorier, nedan är ett exempel på en kategori: beskrivning: "test"

[0]
    icon: "assets/images/test1"
    name: "test"
[1]
    icon: "assets/images/test2.png"
    name: "test 2"

Jag försöker loopa igenom den här arrayen och visa både kategorinamnet och ikonen, men att visa ikonen fungerar inte.

<ng-container *ngFor="let category of this.categories>
   {{category.name}}  
   <img src={{category.icon}}/>               
</ng-container>

Vet någon hur man gör detta? Tack

Svar #1

Jag är inte en Angular-expert, men borde du inte använda []-syntaxen för egenskapsbindning?

T.ex.

<ng-container *ngFor="let category of this.categories">
   {{category.name}}  
   <img [src]="category.icon"/>               
</ng-container>

Du saknar också ett " i slutet av kategorierna.