<ion-item>
<button ion-button [outline]="isOutline" small *ngFor="let sizeList of sizeData" (click)="sizeStore($event,sizeList.id)">{{sizeList.size_name}}</button>
</ion-item>
sizeStore(event,val){
this.isOutline=true;
}
this code is working for all button. but i want to use for specific item not all.
Please any body help. Thanks in advanced.
I find sizeList a weirdly named loop variable, because it seems to be a scalar, not a list, but whatever it is you must hang this isOutline property on each element of sizeData and use that in place of isOutline, as the way you have written it now, there is only one isOutline property shared by all buttons.
export interface SizeCheck {
isOutline: boolean
}
export class SearchModal {
constructor( ){ }
}
sizeStore(event,val, sizeList:SizeCheck){
sizeList.isOutline=true;
}
html
[outline]=“sizeList.isOutline”
same process is working on another page but in this page this process is not working. value is not changing. my process is right or wrong; 
Your (click) handler isn’t being called with sizeList itself, but the id, at least originally. I don’t know if you want it to toggle or not, but you can just say (click)="sizeList.isOutline = !sizeList.isOutline"
sorry i forgot to add this line. i am using this (click)=“sizeStore($event,sizeList.id,sizeData)”. without sizeData it will not work.
Each time you comment, you seem to be contradicting an earlier post, so I have no idea what the actual code looks like at all at this point.
export interface SizeCheck {
isOutline: boolean
}
export class SearchModal {
constructor( ){ }
}
sizeStore(event,val, sizeList:SizeCheck){
sizeList.isOutline=true;
}
<ion-item>
<button ion-button [outline]="sizeList.isOutline ? true : false" small *ngFor="let sizeList of sizeData" tappable (click)="sizeStore($event,sizeList.id,sizeData)">{{sizeList.size_name}}</button>
</ion-item>
full code here.
The call to sizeStore in the template does not match the call signature declared for it in the controller.
how i’ll solve this problem?
Call the handler the way it’s declared. I still think your click handler is far too complicated, but you have to call it with the parameters that are expected, whatever you decide they should be.
<ion-item>
<button ion-button [outline]="sizeList.isOutline" small *ngFor="let sizeList of sizeData" tappable (click)="sizeStore(sizeData, sizeList.isOutline)">{{sizeList.size_name}}-{{sizeList.isOutline}}</button>
</ion-item>
export interface SizeInterface {
msg: any;
isOutline:boolean;
id:any;
size_name:any;
}
export class SearchModal {
constructor( ){ }
}
sizeStore(sizeList:SizeInterface, val){
console.log(val);
if(val === true){
sizeList.isOutline = false;
console.log( sizeList.isOutline);
}else{
sizeList.isOutline = val;
console.log( sizeList.isOutline);
}
}
what i am missing? my work process is wrong? i can’t catch. if you do then how will you finish this.
All I can do is repeat myself at this point. You are not calling the click handler with the parameters it is expecting.
can you show code for this that i am expecting?
I already did in my second post in this thread.
thanks for your help.
How you did that? Can you tell me please!
At last I changed function.
<ion-row>
<ion-col col-2 *ngFor="let sizeList of sizeData">
<button block ion-button [outline]="sizeList.hasTrue" small tappable (click)="sizeStore(sizeList.id)">{{sizeList.size_name}}</button>
</ion-col>
</ion-row>
sizeStore(sizeListId){
let index = this.sizeId.indexOf(sizeListId);
if(index > -1){
this.sizeId.splice(index, 1);
}else{
this.sizeId.push(sizeListId);
}
}
actually i had used it in modal search.