Question

这是我的angular6应用程序的配置文件结构：

Client.component.html应该显示图像“defaultProfilePic.png”。

因此它包含以下代码行：

<img [src]="url"  width="220" height="200">

Client.component.ts包含以下代码行：

private url = "../asset/images/defaultProfilePic.png";

出于某种原因，这不起作用。有没有人知道为什么会这样？

Answer 1

是的，问题是您已经创建了自己的自定义目录，并且您正在尝试从中提供图像您应该使用assets文件夹来存储静态资产，图像等。

如果你想将图像和静态资产存储在另一个目录中，你需要通过在angular.json文件的assets数组中输入一个条目告诉CLI它，你需要确保它在同一个目录中level为assets文件夹。即在app

下创建一个自定义文件夹

"assets": [
              "src/favicon.ico",
              "src/assets"
               src/asset
            ],

你身边的另一个错误是private url =

所有databound属性必须是typescript public属性。

为什么呢？的 Refer this

并且您可以提供绝对路径而不是相对路径，因为CLI知道它

public url = "asset/images/defaultProfilePic.png";

Answer 2

听起来像您的路径不正确尝试添加另一个../并确保您在.angular-cli.json

中设置了以下设置

 "assets": [
        "assets",
        "favicon.ico"
      ],

Answer 3

我找到了一种在Stackblitz中显示Angular静态资产（在我的情况下为.png）的方法。