CODEWITHSUNDEEP
javascriptangularjshtmlionic-framework
Pickles
Pickles

Reputation: 243

How Do I pass an image source to a variable in a function to be then shown to a image tag

I have an Image gallery that has three images, I created a thumbnail for the three images and if ever I click on a thumbnail i want it to show on my main image tag.

This is my main image tag:

<img style="width: 100%;" ng-model="" id="viewpic" name="viewpic" src="something.jpg" >

This is my thumbnails:

<img style="width: 28%;" src="images/terminus_63_img3.jpg" onClick="functionshow();">
<img style="width: 28%;" src="images/terminus_63_img3.jpg" onClick="functionshow();">
<img style="width: 28%;" src="images/terminus_63_img3.jpg" onClick="functionshow();">

Upvotes: 0

Views: 923

Answers (1)

dhavalcengg
dhavalcengg

Reputation: 4713

<img style="width: 100%;" id="viewpic" name="viewpic" ng-src="viewpic" >

<img style="width: 28%;" src="images/terminus_63_img3.jpg" ng-click="functionshow('images/terminus_63_img3.jpg');">
<img style="width: 28%;" src="images/terminus_63_img3.jpg" ng-click="functionshow('images/terminus_63_img3.jpg');">
<img style="width: 28%;" src="images/terminus_63_img3.jpg" ng-click="functionshow('images/terminus_63_img3.jpg');">

in your controller

$scope.functionshow = function (src) {
$scope.viewpic = src;
};

Upvotes: 2

Related Questions