取消选中始终复选框答案

【问题标题】：Uncheck always checkbox取消选中始终复选框
【发布时间】：2020-03-24 14:47:22
【问题描述】：

我正在使用一个复选框，我希望它永远不会被选中。

我为此使用了一个功能，但它不起作用，如果您选中该复选框几次，它就会处于活动状态（选中）。

我怎样才能让它始终处于未选中状态？

.TS

check: boolean = false;

change(e){
  this.check = false
}

.HTML

<ul class="mdc-image-list my-image-list" style="margin-top:120px;padding-left: 10px;padding-right: 10px;">
    <ng-container *ngFor="let product of data; let  j = index;">
        <li class="mdc-image-list__item">
            <div class="mdc-image-list__image-aspect-container">
                        <img [src]="product.image" class="mdc-image-list__image">
            </div>
            <div class="mdc-image-list--with-text-protection">
                <div class="mdc-image-list__supporting mdc-image-list__supporting">
                    <span class="mdc-image-list__label">{{product.name}}</span>
                </div>
                <div class="Info">
                    <dx-check-box (onValueChanged)="change($event);" [(value)]="check"></dx-check-box>
                </div>
            </div>
        </li>
    </ng-container>
</ul>

问题

【问题讨论】：

你不想禁用它？
@ConnorsFan 我打算点击它以从事件中提取数据，但我打算永远不会检查它:(

标签： javascript angular typescript devextreme devextreme-angular

【解决方案1】：

您可以使用[ngModel] 绑定来显示check 值和(ngModelChange) 事件处理来处理更改：

<dx-check-box [ngModel]="check" (ngModelChange)="change($event)"></dx-check-box>

在事件处理程序中：

设置新的check 值
通过调用ChangeDetectorRef.detectChanges 强制更改检测
将check 值重新设置为false

change(value) {
  this.check = value;
  this.changeDetectorRef.detectChanges();
  this.check = false;
  ...
}

请参阅this stackblitz 以获取演示。

【讨论】：

【解决方案2】：

我试过很简单

<dx-check-box [value]="false"></dx-check-box>

但对我来说它不起作用。

好像是个bug什么的。

解决方法是：

<dx-check-box [value]="false" [disable]="true"></dx-check-box> - 工作，看起来有点不同，但您可以在css 中设置一些样式，使其看起来没有被禁用
在复选框上涂上透明的div，它可以防止input被点击

【讨论】：