图片不显示 material 卡

Question

我想在我的项目中显示个人资料图片。但是图像没有显示，它显示替代词。


    <div class="row">
      <div class="col-md-4 col-6">
        <mat-card class="example-card">
          <img mat-card-image src="..\assets\images\signupbg.jpg" alt="Avatar" class="avatar">
          <mat-card-header>
            <div style="text-align:center;">
              <mat-card-title>Samanthika Rajapaksa</mat-card-title>
              <mat-card-subtitle>University of Moratuwa</mat-card-subtitle>
            </div>
          </mat-card-header>
          <mat-card-content>
            <mat-chip-list aria-label="Languages">
              <mat-chip color="primary" selected>Networking</mat-chip>
              <mat-chip color="primary" selected>Angular</mat-chip>
              <mat-chip color="primary" selected>Aws</mat-chip>
              <mat-chip color="primary" selected>Spring Boot</mat-chip>
              <mat-chip color="primary" selected>My SQL</mat-chip>
            </mat-chip-list>
          </mat-card-content>
        </mat-card>
      </div>
    </div>
    </div>

Answer 1

我认为问题出在路径的书写方式上。按照下面给出的方法尝试。

<img mat-card-image src="assets/images/signupbg.jpg" alt="Avatar" class="avatar">

假设您的 assets 文件夹位于 src 文件夹内。

图片不显示 material 卡

Image does not display material card

css

styles

angular-material

angular