Изображения не отображаются в моем угловом приложении - PullRequest
1 голос
/ 27 октября 2019

Раньше сообщалось об ошибке, что моя версия машинописного текста ("typcript": "~ 3.4.3") и версия flex не совместимы друг с другом, поэтому я изменил свою версию flex на самую последнюю (т.е. "@angular/flex-layout": "^8.0.0-beta.27"). ,Теперь нет ошибок при компиляции, а также в консоли, но все равно мои изображения не отображаются. Это мой HTML-код.

<div class="container"
    fxLayout="column"
    fxLayoutGap="10px">
    <mat-list fxFlex>
        <mat-list-item *ngFor="let dish of dishes">
            <img matListAvatar src="{{dish.image}}" alt={{dish.name}}>
            <h1 matLine>{{dish.name}</h1>
            <p matLine><span>{{dish.description}}</span></p>
        </mat-list-item>
    </mat-list>
    }
   </div>

1 Ответ

3 голосов
/ 27 октября 2019

Попробуйте так:

Рабочая демоверсия

<div class="container" fxLayout="column" fxLayoutGap="10px">
    <mat-list fxFlex>
        <mat-list-item *ngFor="let dish of dishes">
            <img matListAvatar [src]="dish.image" [attr.alt]="dish.name">
            <h1 matLine>{{dish.name}}</h1>
            <p matLine><span>{{dish.description}}</span></p>
        </mat-list-item>
    </mat-list>
</div>
...