Angular 2在不重新启动的情况下不显示图像答案

【问题标题】：Angular 2 not showing images without restartingAngular 2在不重新启动的情况下不显示图像
【发布时间】：2018-03-06 02:21:38
【问题描述】：

我正在使用 angular2 和 nodejs 上传图片，当 node 在 assets 文件夹中上传文件时，我尝试使用 angular 显示它并收到错误：

GET http://localhost:4200/assets/img/3.jpg 404 (Not Found)

但是当我的角度服务器重新启动时，图像就在那里。

如何在不重新启动的情况下显示图像？

【问题讨论】：

如果你得到一个带有正确 URL 的 404，那么问题不在于角度，而在于服务器端
src="../../../assets/img/{{blog.image}}" 其中 blog.image 是图片的名称
我尝试过，但没有以这种方式工作，我的新上传图片仅在我重新启动 angular-cli 时才在资产中可见
@AnushChakhoyan 我的文件，当 Angular 应用程序与ng serve 一起运行时，您正在上传图像，是吗？
{{blog.name}}

品牌：{{blog .brand}}

国家：{{blog.country}}

价格：{{blog.price}}

标签： node.js angular angular-cli angular2-template

【解决方案1】：

当您回复我的comment 时，您正在使用ng serve。

问题是，当您运行 ng serve 时，会在内存中触发 webpack dev server - 这不是您想在服务器上运行的东西，它仅适用于开发人员。这样，在您重新启动 ng serve 之前，您的 assets 文件夹中不会发生任何更改，因为它是 default folder for your static assets configured in .angular-cli.json：

您使用 .angular-cli.json 中的 assets 数组来列出文件或文件夹您想在构建项目时按原样复制。

所以assets 文件夹不是存储任何动态内容的最佳位置。

【讨论】：

@AnushChakhoyan 我不知道有关您的上传过程的任何详细信息，但我猜它是作为单独的 API 实现的。因此，您必须为此更改输出文件夹（应该是 Angular 应用程序之外的文件夹，将图像写入属于您的服务器端的文件夹）然后一旦上传图像，您就必须在您的 Angular 应用程序中从服务器请求该图像.
@Kuncevic 我也在为此苦苦挣扎。在我将文件上传到 assets/upload 文件夹之前，但从这个答案中，我已将图像上传到 public/uploads 文件夹。但我不知道如何从角度访问该图像。你能告诉我如何访问该图像吗？