CODEWITHSUNDEEP
angularjs
Craig
Craig

Reputation: 1225

Angularjs display images based on names in database

I am attempting to display an image on a view. I have a list of image names in the database and have the actual images stored in content/images. All that is showing up when I loop through is the alternate name and I only get that once. There should be 7 images or at the very least 7 alternate names being shown.

This is the code where I am attempting to show the images - 

        <div class="row">
            <div ata-ng-repeat="route in vm.routes">
                <img data-ng-src="Content/images/{{route.department.imageNameLight}}.jpg" alt="test" />
            </div>
        </div>

I have looked a vm.routes and it does have the correct information. The image name is surrounded with quotes if that makes a difference? Eventually I will have a maximum of two rows of six images either show the light version of the image or the dark depending on a status flag.

Upvotes: 1

Views: 869

Answers (1)

adam0101
adam0101

Reputation: 31005

Try this:

<div class="row">
    <div ata-ng-repeat="route in vm.routes">
        <img data-ng-src="{{'Content/images/' + route.department.imageNameLight + '.jpg'}}" alt="test" />
    </div>
</div>

Upvotes: 1

Related Questions