How to access an array from an AngularJS template

Question

I am trying to display images in a list. The path to the image is stored in an array called imagesUrls.

imagesUrls['dhd.png'] = "./img/brands/dhd.png" imagesUrls['channelislands.png'] = "./img/brands/channelislands.png"

etc...

<ion-item collection-repeat="item in prodataSelect | unique:'brand' | orderBy:'brand'" collection-item-height="75" >
   <img class="selectBrandImage" ng-src="imagesUrls['{{item.brand | nospace | lowercase}}.png']" />
   <span classs="selectBrandName">{{item.brand}}</span>
</ion-item>

controllers.js:

prodata = sessionService.get('prodata');
$scope.prodataSelect = prodata;
$scope.imagesUrls = sessionService.get('imagesUrls');

I can't find the right syntax for the ng-src in the template, can you help please ?

I also tried this:

ng-src="getImgPath(item.brand)"

with this:

$scope.getImgPath = function(str) {
   return imagesUrls[$filter('nospace')($filter('lowercase')(str))];
}

What is the value of src when you inspect the element in your browser? Do you have a fiddle that we can play with? — ltalhouarne
– ltalhouarne, Commented Oct 23, 2015 at 14:18
with src instead of ng-src, I get the same result in the src when I inspect — Louis
– Louis, Commented Oct 23, 2015 at 14:35
How is the image array related to the prodata object? By order? — isherwood
– isherwood, Commented Oct 23, 2015 at 15:01

Louis · Accepted Answer · 2015-10-23 15:04:03Z

1

It works with this:

ng-src="{{getImgPath(item.brand)}}"

and

 $scope.getImgPath = function(str) {
    str = $filter('nospace')($filter('lowercase')(str));
    str = str + ".png";
    return $scope.imagesUrls[str];
  }

answered Oct 23, 2015 at 15:04

Louis

2,62013 gold badges68 silver badges124 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to access an array from an AngularJS template

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related