如何从src / images文件夹而不是angular 2中的assets文件夹加载图像

Question

我是Angular 2的新手。我正在通过角度cli生成角度2项目。如果我将我的图像保留在src/images文件夹中，则在浏览器中找不到它显示的404文件，如果它在src/assets文件夹中，则显示图像。

它背后的原因是什么以及如何从src / images文件夹加载图像.. ??

<div style="text-align:center">
  <h1>
    Welcome to {{title}}!
  </h1>
  <img width="300" src="./images/img.jpg">
</div>

输出的

browser output链接

code snap源代码快照

Answer 1

angular-cli生成.angular-cli.json，您可以在其中找到项目配置，使用.angular-cli.json中的资产数组列出要在构建时按原样复制的文件或文件夹项目

将您的文件放在assets内并使用：

<img width="300" src="/assets/images/img.jpg">

Answer 2

更新了最新答案：

按照以下步骤操作：

我的图片位于src =＆gt; images =＆gt; 1.png它意味着位于资产文件夹外面

<强> .angular-cli.json

打开angular-cli.json文件，找到assets数组，在数组中添加你的文件夹名称，如图像。

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

<强> componenet.html

<img src="images/1.png">