我是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
,并且我想在检查命题后更改它。这是一张图像,它看起来是如何更好地理解问题。
有什么需要帮忙的吗?
发布于 2017-06-22 20:35:36
如果您将双括号添加到ngModel引用,您将获得到模型属性的双向绑定。然后,可以在事件处理程序中读取和使用该属性。在我看来,这是最干净的方法。
<input type="checkbox" [(ngModel)]="myModel.property" (ngModelChange)="processChange()" />
发布于 2016-05-07 01:01:04
您可以像这样使用ngModel
<input type="checkbox" [ngModel]="checkboxValue" (ngModelChange)="addProp($event)" data-md-icheck/>
要通过更新代码中的属性checkboxValue
并在用户更改checkbox时更新checkbox状态,将调用addProp()
。
https://stackoverflow.com/questions/37077707
复制相似问题