* ngFor - массив URL-адресов изображений - не работает

Question

Я пытаюсь показать массив изображений через *ngFor. он должен показывать все разные изображения, но вместо этого он показывает только одно и первое изображение массива.

Пока:

private localImg:any = [];
  constructor() { }

  ngOnInit() {
    this.localImg = [     
     {id:0,name:"img0",url:'assets/img/img0.png'},
     {id:1,name:"img0",url:'assets/img/img1.png'},
     {id:2,name:"img0",url:'assets/img/img2.png'},
     {id:3,name:"img0",url:'assets/img/img3.png'},
     {id:4,name:"img0",url:'assets/img/img4.png'},     
      ]
      console.log("image", this.localImg);
  }

<div class="container-fluid" *ngFor="let img of localImg">
   <div class="row imagetiles">
        <div class="col-lg-3 col-md-3 col-sm-3 col-xs-6">
            <img [src]='img.url' class="img-responsive">
        </div>
   </div>
</div>

Я пытался получить изображения, используя [src]='img.url' и изменил на [src]='img.id' и name, но не повезло.

Или, пожалуйста, предложите мне другое, более короткое и простое решение.

Большое спасибо за ваши решения.

Answer 1

Скорее всего, проблема в том, что вы ссылаетесь на свои пути следующим образом:

url:'assets/img/img0.png'

вместо:

url:'./assets/img/img0.png'

Answer 2

Я создал новый проект с этой реализацией:

App.component

import { Component } from '@angular/core';

    @Component({
      selector: 'app-root',
      templateUrl: './app.component.html',
      styleUrls: ['./app.component.css']
    })
    export class AppComponent {
      imgList: any[] = []

      constructor(){
        this.imgList = [
          {id: 1, path:"./assets/1.jpeg"},
          {id: 2, path:"./assets/2.jpeg"},
          {id: 3, path:"./assets/3.jpeg"}
        ];
      }
    }

App.component.html

<div *ngFor="let i of imgList">
  <img [src]="i.path" style="width:100px">
</div>

Структура проекта:

и вот результат:

Поскольку единственная проблема, которую я вижу, это путь, вы уверены, что путь к изображениям правильный? Кроме того, действительны ли изображения?