Changing the view based on radio button selection


#1

Hi I’m fairly new with Ionic and AngularJS.
I have created a page to select different options and display them on the next page, however I am stuck with how to make the two separate pages. I have two options:

<ion-radio ng-model="choice" ng-value="indoor">Indoor</ion-radio>
<ion-radio ng-model="choice" ng-value="outdoor">Outdoor</ion-radio>

So if the indoor value was chosen 3 drop-downs would appear on the page and if outdoor was selected 6 would appear.

Thanks


#2

Hi, I’m have a similar thing I would like to solve. I would like to get an image to change based depending on which radio button is selected. I have a main image and I want that to change in relation to 5 different options, which each have a radio button.

Were you able to find a solution to your problem? Cheers.


#3

You define a variable like imageToShow: string; and set its value to the URI of the image you want to show. (I primarily use dataURLs because it helps with cropping etc, but you could use the source path to disk or web). Then in your html image element, set [src]=imageToShow;


#4

Thanks. I’m really new at this. Would you mind showing me an example? I’m having trouble writing the function itself. I understand conceptually what I am going for. Cheers.