最佳答案
下面的代码将满足您的要求.更改复选框限制以增加或减少可以选择的选项数.优化提示也受到欢迎.
原文链接:https://www.f2er.com/js/429230.html组件文件
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'page-home',templateUrl: 'home.html'
})
export class HomePage {
selectedIng : ArrayBoxLimit : any =1;
constructor(public navCtrl: NavController) {
this.pizzaIng=[
{name : "Pepperoni",checked : false},{name : "Sasuage",checked : true},{name : "Mushrooms",checked : false}
];
this.selectedIng=[{name : "Sasuage",checked : true}];
}
updateIng(ing){
if(ing.checked === true){
this.selectedIng.push(ing);
this.numberOfChecks++;
}else{
this.selectedIng=this.pizzaIng.filter((ingr)=>{
console.log(ingr['checked'])
return ingr['checked']===true;
})
this.numberOfChecks--;
}
console.log(this.selectedIng);
console.log(this.numberOfChecks);
}
}
HTML文件
Box [(ngModel)]="ing.checked" [disabled]="ing.checked==false && numberOfChecks>=checkBoxLimit" (ionChange)="updateIng(ing)">Box>