在Angular2中选中复选框时启动事件
在Angular2中选中复选框时启动事件
提问于 2016-05-07 00:55:45
我是Angular2和web的新手，我想在检查checkbox和/或使用Material-Design取消选中它时，启动一个操作来更改数据库中的对象参数值。我尝试使用[(ngModel)]，但什么也没有发生。这个想法是，我必须添加一些具有checked | unchecked状态的命题，以判断它是true还是false命题。以下是命题模型
export class PropositionModel {
id:string;
wordingP:string; // the proposition
propStatus:Boolean; // the proposition status
}以下是一个命题的Html代码：
<div class="uk-width-xlarge-1-1 uk-width-medium-1-2">
<div (submit)="addProp1()" class="uk-input-group">
<span class="uk-input-group-addon"><input type="checkbox" data-md-icheck/></span>
<label>Proposition 1</label>
<input [(ngModel)]="proposition1.wordingP" type="text" class="md-input" required class="md-input"/>
</div>
</div>以下是添加该命题的TypeScript代码：
addProp1() {
this.proposition1 = new PropositionModel();
this.proposition1.propStatus = false;
this.propositionService.addProposition(this.proposition1)
.subscribe(response=> {
console.log(response);
console.log(this.proposition1);
this.proposition1 = new PropositionModel();})
}正如您所看到的，我在默认情况下将其设置为proposition status的false，并且我想在检查命题后更改它。这是一张图像，它看起来是如何更好地理解问题。
有什么需要帮忙的吗？
回答 2
Stack Overflow用户
发布于 2017-06-22 20:35:36
如果您将双括号添加到ngModel引用，您将获得到模型属性的双向绑定。然后，可以在事件处理程序中读取和使用该属性。在我看来，这是最干净的方法。
<input type="checkbox" [(ngModel)]="myModel.property" (ngModelChange)="processChange()" />Stack Overflow用户
发布于 2016-05-07 01:01:04
您可以像这样使用ngModel
<input type="checkbox" [ngModel]="checkboxValue" (ngModelChange)="addProp($event)" data-md-icheck/>要通过更新代码中的属性checkboxValue并在用户更改checkbox时更新checkbox状态，将调用addProp()。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37077707
复制相关文章
相似问题