如果我只是将图像文件路径硬编码到img src属性中,就像这样......
img src="../../../../Resources/homeImage.png"
......众神对我感到高兴,图像被展示给所有人。
但..........
如果我使用以下任一方法创建一个名为homeImage的组件属性,其值相同,
public homeImage = "../../../../Resources/homeImage.png"
public homeImage = "http://localhost:54270/Resources/homeImage.png"
然后尝试使用homeImage属性,如下所示,
img src="{{homeImage}}"
img [src]="homeImage"
这两种方法都解析为资源,但我找不到404。
已经过了几个小时,我现在头疼了。 在这个黑暗的地方流下的任何光都不仅仅是值得赞赏的。
您需要将图像放在assets文件夹中,并使用相对路径来引用它。 Assets文件夹通常在app/src
下
<img src="assets/img/1.jpg" alt="image">
我将带有我的图像的Resources文件夹添加到dist文件夹中 像这样创建属性...... public homeImage =“/ did / Resources / homeImage.png” 然后我在img元素的src属性中使用homeImage
你应该使用
assets
文件夹来存储你的静态资产,图像等。
如果要将图像和静态资源存储在另一个目录中,则需要通过在angular.json文件的assets
数组中创建一个条目来告诉CLI它,并且需要确保它与assets
文件夹位于同一级别。即在app下创建一个自定义文件夹
"assets": [
"src/favicon.ico",
"src/assets"
src/Resources
],
并且您可以提供绝对路径而不是相对路径,因为CLI知道它
public url = "Resources/homeImage.png";