html - 图像未显示在 HTML 页面上

Question

我正在尝试使用内部路径中的 ion-avatar 标签加载两个图像文件，并且我一直在尝试这样做，使用外部谷歌链接和本地路径，但在这两种情况下都没有加载图像。我已经玩了一段时间的路径，但我仍然无法弄清楚出了什么问题。

这就是我在我的 HTML 页面中尝试的方式

 <ion-item *ngFor="let question of questions">
          <ion-avatar slot="start">
            <ion-img [src]="question.imageUrl"></ion-img>
          </ion-avatar>

我的 home.service.ts

     private questions: Questions[] = [
    {
      id: 'p1',
      title: 'quanto da 1+1?',
      imageUrl: 'img1.jpg',
      text:"Como faço pra calcular 1+1?",
      questions: ['local', 'endereço', 'horario']
    },
    {
      id: 'p2',
      title: 'vaga de emprego',
      imageUrl: 'https://commons.wikimedia.org/wiki/File:Julio_Dantas.jpg',
      text:'Alguem sabe de uma vaga de emprego?',
      questions: ['vaga', 'experencia', 'salario']
    }
  ];

我的图像在本地的位置

编辑：我更改了链接，它开始正常工作，但是我的图像和页面下方的内容现在显示为滚动...

标签： htmlangularionic-frameworkionic4

Answer 1

使用该[alt]属性检查图像标签是否正在加载。如果加载，则意味着[src]路径存在问题。