How to dynamcally show selected radio in ionic3?

Ionic Framework ionic-v3
1 
	<ion-select interface="popover">
		<ion-option *ngFor="let category of adminCategoriesList" [value]="category" selected="checkedSelectedCategory(category.categoryKeyId)">
		          {{category.categoriesDto.categoryName}}
	     </ion-option>
	</ion-select>

	   checkedSelectedCategory(keyId) {
		    //Used for show the checkbok will be true
		    for(var i=0; i<this.adminCategoriesList.length;i++){
			  if(this.adminCategoriesList[i].categoryKeyId == keyId) {
		 		return true;
		 	   }
		    }
	    }	`

Hello to all,
I have to show the radio will be selected if keyId will be match in the object in ionic i am calling a function with selected but radio is not selected tell me anyone  what's  the wrong in my code?
2

One problem is that you have a function call in a template expression. Get rid of that so that the option values are set from a scalar property and perhaps your problem will solve itself.

3

Ok sir tell me how to call function with ion-select?

4

You’re not listening. I’m saying don’t do that.

5

sir i not understand what are you saying?

6

You see, rapropos is telling u that

<ion-select interface="popover"> <ion-option *ngFor="let category of adminCategoriesList" [value]="category" selected="checkedSelectedCategory(category.categoryKeyId)"> {{category.categoriesDto.categoryName}} </ion-option> </ion-select>

If you put a function (for your example it’s "checkedSelectedCategory(category.categoryKeyId)"> under the tag , it simply will not work…

Suppose I were to rewrite your code

	<ion-select interface="popover" [(ngModel)]="someVariable">
		<ion-option *ngFor="let category of adminCategoriesList" [value]="category" >
		          {{category.categoriesDto.categoryName}}
	     </ion-option>
	</ion-select>

that way, someVariable will be bind to the value, and u don’t really need the selected true checkmark

7

Ok sir i am understand but my case is different i have to implemented the edit product in which we have to show the selected category will be selected that is selected user during add product time?

8

Suppose u want to run some function once user click on the user option

<ion-select interface="popover" [(ngModel)]="someVariable">
		<ion-option *ngFor="let category of adminCategoriesList" [value]="category" 
                 (ionChange)="checkedSelectedCategory (category.value)">
		          {{category.categoriesDto.categoryName}}
	     </ion-option>
	</ion-select>

//Basically, ionChange will trigger the function you want when there is a change of value...which probably will work in your case
9

@jchoh05222 Yes Sir this is correct but i have to call checkedSelectedCategory function after page load?

10

Depends on what you want to do really. If you want to bind a default value to your ion-select…[(ngModel)] will do the trick… you don’t really need that function

1 Like
11

ok sir tell me how to do this?

12

Just learn from the code i posted above…at this point i will just be spoonfeeding…

13

ok sir i will try above code