web-dev-qa-db-ja.com

angular Materialのクリックイベントでステータスを確認します

angular要素があります

<mat-checkbox class="btn-block" 
              labelPosition="before" 
              (change)="showOptions($event)" 
              (click)="makeJSON($event.checked,i,j,k)">
</mat-checkbox>

ここで、onchange(実際にチェックアウトのステータスを提供します)は他のタスクを実行していますが、クリックイベントでチェックボックスのステータス(チェック済みまたは未チェック)が必要です。

クリックによって作成されたオブジェクトを既に見てみましたが、クリックオブジェクトが中にないので、チェックボックスがチェックされているかどうかをどのように検出できますか。

18
Apoorv

使用できます

(change)="showOptions($event)" 
(change)="makeJSON($event.checked,i,j,k)">

または

(change)="showOptions($event);makeJSON($event.checked,i,j,k)">
35

別の解決策としては、チェックボックスでテンプレート参照変数を使用し、その変数をメソッドパラメーターに渡すことができます。

 <mat-checkbox #checkbox (change)='showOptions(checkbox.checked)' value=''>all</mat-checkbox> 

ここ#checkbox参照は、チェックボックスに関連するすべてのプロパティ(値、チェック済みなど)を保持します。 checkbox.checkedこれは、trueおよびfalseのチェックボックスの現在の状態を示します。

1
sharad jain