如何使用 typescript 计算 Angular 2/4 中选中的框数量。它应该显示选中的复选框的数量,如果未选中,它应该减少到 0。
我的示例,来自服务器的数据,我循环遍历:
我知道如何在 Angularjs 中使用 foreach 函数来做到这一点,但无法理解如何在 Typescript 中做到这一点,通常我必须用 Typescript foreach 方法替换 Angular foreach 方法?需要帮助
app.ts
data = [
{"name":"jason"},
{"name":"james"},
{"name":"josh"},
{"name":"joshua"}
];
calculateChecked = function() {
let count = 0;
angular.forEach(this.data, function(value) { //don't work in typescript
if(value.checked)
count++;
});
return count;
};
};
app.htm
<li class="list-group-item" *ngFor="let user of data">
<input type="checkbox" [ngModel]="user.checked"/>
{{user.name}}
</li>
<p>total checked: {{calculateChecked()}}</p>
应该显示:
如果未选中应显示 0
<div class="sasha-ui-list" #em *ngFor="let email of emails; let i=index"
(click)="onAddtoMessage(email)"> <div class="row"> <div class="col-lg-1">
<input class="magic-checkbox sasha_checkbox" name="emails" type="checkbox"
id="{{email.id}}" value="email" [checked]="checkboxFlag"> <label for="
{{email.id}}"></label> </div>
最佳答案
点击时应将其设置为 0,如下所示,
changed(){
this.count = 0;
this.data.forEach(item=>{
console.log(item)
if(item.checked){
this.count= this.count+1
}
} )
}
<ul> <li class="list-group-item" *ngFor="let user of data">
<input type="checkbox" [(ngModel)]="user.checked" (ngModelChange)="changed()"/>
{{user.name}}
</li>
<强> LIVE DEMO
关于javascript - 计算 Angular 2 Typescript 中选中了多少个复选框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47433991/