角度,未找到图像(GET 404)

Question

我正在尝试将图像嵌入到我的角度项目中,但我收到的错误是无法找到图像.

GET http://localhost:4200/logo.svg 404 (Not Found)

我试图用这样的标准方法嵌入图像

<img src="../logo.svg">

我检查了源代码并尝试了其他文件格式.

Answer 1

@Parth Ghiya评论了我的问题的答案.我不得不将图像放到/ src/assets文件夹中.Angular现在能够找到图像.

Answer 2

静态资源（图像、字体、json 文件等）应添加到资产文件夹中。默认情况下，无论您在 assets 文件夹中放置什么，您都可以直接从浏览器访问它并通过 HTTP 请求进行查询：

src
 ? app
 ? ? core
 ? ? shared
 ? ? app-routing.module.ts
 ? ? app.component.ts
 ? ? app.module.ts
 ? assets
 ? ? img
 ? ? ? logo.png // this will be served
 ? static
 ? ? ? background.png // this won't be served unless you added to the assets array
 ? environments
 ? styles
 ? favicon.ico
 ? index.html
 ? main.ts
 ? polyfills.ts

现在，如果您想使用作为文件夹的logo.png图像，assets/img您可以这样做：

<img src="assets/img/logo.png" alt="logo">   <!-- OK  :)   ->
<img src="static/background.png" alt="logo"> <!-- Not OK :(->

如果要使用文件夹background.png内的static，则需要将该static文件夹包含在文件内的资产数组中angular.json：

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

<img src="assets/img/logo.png" alt="logo">   <!-- OK :) ->
<img src="static/background.png" alt="logo"> <!-- OK :) ->

我想强调最好不要：

• 使用src/来引用您的静态资源（图像等）。
• 使用相对路径../logo.png。

Answer 3

错误

<img src="src/static/images/logo.png" alt="" width="49" height="35">

解决方案（取出src）

<img src="static/images/logo.png" alt="" width="49" height="35">

高兴起来，“欢迎来到 scaman 的世界！”..