그래서 저는 이것을 html
사용하여 동적으로 카드를 생성하는*ngFor
<ion-card *ngFor="let numbers of [0,1,2,3]; let i = index">
<ion-card-content>
<ion-card-title clear>
Card {{i}}
</ion-card-title>
</ion-card-content>
<button ion-button block class="blockbutton" (click)="doSomething(i)">
<ion-icon [name]="iconName" class="plussign"></ion-icon>
<div> Join Room </div>
</button>
</ion-card>
그리고 이것은 내 .ts
export class FeedPage {
iconName : string;
constructor(public navCtrl: NavController) {
this.iconName = 'add-circle';
}
}
public doSomething(item): void{
console.log(item);
this.iconName = 'checkmark-circle';
}
따라서이 코드는 블록 버튼을 클릭하면 모든 블록 버튼의 모든 아이콘을 checkmark-circle
어떻게 변경합니까 에만 특정 버튼의 아이콘 즉 [name]
속성 checkmark-circle
.
index
해당 요소 를 검색하는 데 성공했습니다 . 하지만 특정 버튼 만 수정하려면 어떻게해야합니까?
배열이 iconNames
.
<ion-icon [name]="iconName[i]" class="plussign"></ion-icon>
구성 요소 측면에서 :
public doSomething(item): void{
console.log(item);
this.iconName[item] = 'checkmark-circle';
}
}
하지만 카드 수에 따라 전체 어레이를 설정해야합니다.
iconNames:string[]=[];
constructor(public navCtrl: NavController) {
//loop through your card count and push initial value.
iconNames.push(`add-circle`);
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다