私はAngular2とWebの初心者です。checkboxを使用してチェックまたはチェック解除するときにデータベース内のオブジェクトパラメータ値を変更するアクションを起動したいのですMaterial-Designが、 を試しましたが何も起こりませんでした。アイデアは、それが命題であるか命題であるかを判断するために、ステータスを[(ngModel)]持ついくつかの命題を追加する必要があるということです。これが命題モデルです。checked | uncheckedtruefalse
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();})
}
ご覧のとおり、これをfalseのデフォルトに設定しましたproposition statusが、提案を確認したら変更したいと思います。問題をよりよく理解できるように、これがどのように見えるかを示す画像を以下に示します。
何か助けてください。
ベストアンサー1
テンプレート： ネイティブchangeイベントまたは NgModel ディレクティブのいずれかを使用できますngModelChange。
<input type="checkbox" (change)="onNativeChange($event)"/>
または
<input type="checkbox" ngModel (ngModelChange)="onNgModelChange($event)"/>
TS:
onNativeChange(e) { // here e is a native event
if(e.target.checked){
// do something here
}
}
onNgModelChange(e) { // here e is a boolean, true if checked, otherwise false
if(e){
// do something here
}
}