CODEWITHSUNDEEP
angularjsimage
StepUp
StepUp

Reputation: 38094

ng-src for local images

I have an AngularJS project and I am trying to show an image from local folder. My folder hierarchy is like this:

--app(folder)
-----controllers(folder)
-----services(folder)
-----views(folder)
--------images(folder)
-----------image1.jpg
-----------image2.jpg
-----------image3.jpg
--------persons.html
--------departments.html
--index.html

I have in image address in personsController.js:

$scope.fooImageAddress='images/image1.jpg';

and in person.html:

<img ng-src="{{ fooImageAddress}}" alt="here should be an image"/>

And nothing shows, just alt message if img. What can I do?

I've read this question, this and this, and tried suggestions, nevertheless there is no result.

Upvotes: 5

Views: 8684

Answers (3)

Stephen
Stephen

Reputation: 115

Please try this one, "fooImageAddress" is a parameters.

 <img src= "assets/images/{{fooImageAddress}}" />

Upvotes: 0

omer cohen
omer cohen

Reputation: 282

it is look like wrong path from a controller the path is different:

$scope.fooImageAddress='../views/images/image1.jpg';

if is was from person page , you was right.

why are you using "ng-src" and not src if is only one image but use like that

<img ng-src="{{'images/'+imageName+'.jpg'}}" alt="here should be an image"/>

$scope.imageName = image1;

Upvotes: 0

Livio Brunner
Livio Brunner

Reputation: 193

You must change your address, relative to your index.html file

So I suppose app/views/images/image1.jpg

Upvotes: 5

Related Questions