尝试此：
我在获取角度为4的图像时遇到问题。它一直告诉我找不到图像。
文件夹结构：
app_folder/
app_component/
- my_componenet
- image_folder/
- myimage
我正在使用mycomponent中的图像。如果在mycomponent中，则直接使用以下命令将其插入：
<img src="img/myimage.png"
这工作正常，但我检查了html并创建了一个哈希。但是我的图片必须动态添加到html中，因为它们是列表的一部分。因此，如果我使用：
<img src="{{imagePath}}">
基本上是img/myimage.png，它不起作用。如果我使用：
<img [src]="imagePath">
它说NOT FOUND (htttps://localhost/img/myimage.png)。你能帮我吗？
AngularJS
<img ng-src="{{imagePath}}">
角度
<img [src]="imagePath">
关于Angular 2、2+属性绑定如何工作的重要观察。
<img width="300" src="assets/company_logo.png">
的问题在执行以下操作时不起作用：
[src]="imagePath"<img src="img/myimage.png">由于您的绑定声明，<img src={{imagePath}}>直接绑定到组件的[src]="imagePath"，或者如果它是ngFor循环的一部分，则绑定this.imagePath。
但是，在其他两个工作选项上，您要么在HTML上绑定字符串，要么允许将HTML绑定到尚未定义的变量。]>
如果绑定*each.imagePath，HTML将不会引发任何错误，但是Angular会。
我的建议是如果不能定义变量，请使用内联-如果]，例如<img src=garbage*Th_i$.ngs>，可以将其作为<img [src]="!!imagePath ? imagePath : 'urlString'">。
避免绑定到可能丢失的变量，或在该元素中充分利用node.src = imagePath ? imagePath : 'something'。
尝试此：
*ngIf角度4至8
两项工作
<img class="img-responsive" src="assets/img/google-body-ads.png">组件将是
<img [src]="imageSrc" [alt]="imageAlt" /> <img src="{{imageSrc}}" alt="{{imageAlt}}" />树结构：
export class sample Component implements OnInit { imageSrc = 'assets/images/iphone.png' imageAlt = 'iPhone'
如果包含资产文件夹，请在应用程序下的your.angular-cli.json中检查->资产：[]。
或者也许在这里：-> src
-> app
-> assets
-> images
'iphone.png'
，可以提供帮助。
您必须使用此代码倾斜添加图像路径。如果您的图像在资产文件夹下，则。
https://github.com/angular/angular-cli/issues/2231
如果不在资产文件夹下，则可以使用此代码。
<img src="../assets/images/logo.png" id="banner-logo" alt="Landing Page"/>
Angular-cli默认情况下在构建选项中包含资产文件夹。当我的图像名称带有空格或破折号时，出现此问题。例如：
如果将图像放在assets / img文件夹中，那么此代码行应在您的模板中起作用：
<img src="../images/logo.png" id="banner-logo" alt="Landing Page"/>如果问题仍然存在，请检查您的Angular-cli配置文件，并确保在构建选项中添加了资产文件夹。
在angular.json中添加
<img [alt]="My image name" src="./assets/img/myImageName.png'">
然后像这样使用它： "assets": [
"src/favicon.ico",
"src/assets"
],
并且在ts中：<img src={{imgPath}} alt="img"></div>
尝试此：
角度4至8
如果包含资产文件夹，请在应用程序下的your.angular-cli.json中检查->资产：[]。
您必须使用此代码倾斜添加图像路径。如果您的图像在资产文件夹下，则。
Angular-cli默认情况下在构建选项中包含资产文件夹。当我的图像名称带有空格或破折号时，出现此问题。例如：
在angular.json中添加
将图像复制到资源文件夹。 Angular只能从资产文件夹访问静态文件，例如图像和配置文件。
尝试这样：<img src="assets/img/myimage.png">
在资产文件夹下创建图像文件夹
<img src="assets/images/logo_poster.png">
在您的组件中分配一个变量，例如，
export class AppComponent {
netImage:any = "../assets/network.jpg";
title = 'app';
}
在您的src中使用此netImage来获取图像，如下所示，
<figure class="figure">
<img [src]="netImage" class="figure-img img-fluid rounded" alt="A generic square placeholder image with rounded corners in a figure.">
<figcaption class="figure-caption">A caption for the above image.</figcaption>
</figure>
@@可以在__component.ts文件中创建一个变量
myImage：string =“ http://example.com/path/image.png”;
并且在__。component.html文件中，您可以使用这三种方法之一：
1。
<div> <img src="{{myImage}}"> </div>
2。
<div> <img [src]="myImage"/> </div>
3。
<div> <img bind-src="myImage"/> </div>
[问题是，通过某种方式将路径插入src时，无法以某种方式识别该路径。我必须创建一个像这样的变量：
path:any = require("../../img/myImage.png");
然后我可以在src中使用它。谢谢大家！
<img src="images/no-record-found.png" width="50%" height="50%"/>
您的图像文件夹和index.html应该在同一目录中（遵循以下目录结构）。它甚至可以在构建后工作
目录结构
-src
|-images
|-index.html
|-app
Angular只能从资产文件夹访问静态文件，例如图像和配置文件。一种下载远程存储图像的字符串路径并将其加载到模板的好方法。
public concateInnerHTML(path: string): string {
if(path){
let front = "<img class='d-block' src='";
let back = "' alt='slide'>";
let result = front + path + back;
return result;
}
return null;
}
在Component imlement DoCheck接口中，并在其中包含数据库的公式。数据库查询只是一个示例。
ngDoCheck(): void {
this.concatedPathName = this.concateInnerHTML(database.query('src'));
}
并且在html模板（C0）中
您必须提及图像的宽度作为默认值
<div [innerHtml]="concatedPathName"></div>它基于所有其他替代方法为我工作。