时间戳

首页 > 解决方案 > 关闭模态后取消选中材料复选框

angular - 关闭模态后取消选中材料复选框

问题描述

在应用程序中，我有一个过滤表的复选框。在该表中，您有一个返回产品的按钮。关闭确认模式后，我想取消选中该复选框。

如果我手动选中/取消选中复选框，ngModelChange 运行良好。

我试过（ngModelChange），（更改），[检查]

角度版本：8

HTML：

<mat-checkbox (ngModelChange)="changeSeeOnlyInUse()" [(ngModel)]="seeOnlyInUse">Show Only Products in use.</mat-checkbox>
<div class="table-container"> 
    <table>
        ...
    </table>
</div>

TS：

ngOnInit() {this.seeOnlyInUse=false;}

public returnProduct(registration) {
    //do some stuff and open modal
    modalRef.afterClosed().subscribe (response => {
        // do some stuff
        this.seeOnlyInUse = false; //<- now I want to uncheck box})
}

public changeSeeOnlyInUse(){
    this.seeOnlyProductsInUse = !this.seeOnlyProductsInUse;
    // do some stuff }

标签： angularcheckboxangular-material

解决方案

你可以试试这个：

HTML

<mat-checkbox [(ngModel)]="seeOnlyInUse"[formControl]="checkboxFormControl">>Show Only Products in use.</mat-checkbox>
<div class="table-container"> 
    <table>
        ...
    </table>
</div>

TS

checkVCFormControl : FormControl =  new FormControl("")

....

this.checkboxFormControl.valueChanges.pipe(takeUntil(this._onDestroy)).subscribe(() => {
  // do some stuff
});

推荐阅读