使用Angular JS添加图像 [英] Adding images with Angular JS

问题描述

你好，我是新来的角js，我正在使用的应用程序使用它。但是我偶然发现了一个问题......（我主要做html / css），它们以标准的方式将图像添加到标记中：

 < img src =image / source / image.png/> 
  

所以我对控制器文件做了如下操作：

  subscriptionControllers.controller（'imagesController'，function（$ scope）{
 $ scope.image = [{
 src：'image / source / image .png'，
}]; 
}）; 
  

然后添加到html：

 < img ng-src ={{image}}/> 
  

但仍然没有显示出来。

编辑：

b

是图像存在，路径正确
当我查看控制台时，它将图像显示为：
image.png％22％7D]
/ subscription / images

所以它会在图像中添加％22％7D我不知道为什么，如果点击控制台中的图像链接，到404页面。 b
$ b 编辑：
我不再认为这是问题，当我查看控制台并单击图像选项卡时，它将图像显示为类型：html / text我不知道它为什么这样做，任何线索？

解决方案

我可以看到你的图像模型是一个数组json对象。如果是这样，请在访问图像模型时在视图中进行以下更改。

 < img ng-src ={ {图像[0]的.src}}/> 
  

Hi I am new to angular js, the app I am working on uses it. But I have stumbled into a problem... (I mainly do html/css) when adding images to the markup the regular way they dont show up:

<img src="image/source/image.png"/>

So I did the following to the controller file:

  subscriptionControllers.controller('imagesController', function($scope) {
  $scope.image = [{
    src: 'image/source/image.png',
  }];
});

then added to the html:

<img ng-src="{{image}}"/>

But still nothing is showing up.

Any help with this is greatly appreciated, thank you!

EDIT:

Yes the image exists, and the path is correct When I look at the console it shows the image as a: image.png%22%7D] /subscription/images

so it is adding %22%7D to the image I don't know why, if I click the image link in the console it takes me to a 404 page.

Edit: I no longer think this is the problem, when I look at the console and click the images tab, it displays the image as type: html/text I am not sure why it is doing this, any clue?

解决方案

I could see your image model is an array of json object. If so then please do the below changes in the view while accessing the image model.

<img ng-src="{{image[0].src}}"/>

这篇关于使用Angular JS添加图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！