Question

我有以下代码段：

Nil

在没有<div class="custom-control custom-checkbox" *ngFor="let airline of airlines"> <input type="checkbox" (click)="airLineFilter($event)" value="{{airline}}" name="{{airline}}" class="custom-control-input"> <label class="custom-control-label" for="{{airline}}">{{airline}}</label> </div> *ngFor的情况下，此事件可以正常运行：

(click)

但是在使用<div class="custom-control custom-checkbox"> <input type="checkbox" id="americanAir" (click)="airLineFilter($event)" value="American Airlines" name="airlines" class="custom-control-input"> <label class="custom-control-label" for="americanAir">American Airlines</label> </div>之后，点击事件并未触发。有什么我可以解决的吗？？

Answer 1

在经历了许多选择之后，我终于找到了解决方案。这是由于复选框的 Id 属性和标签的 for 属性所致。

当我将代码更改为这样的内容时，它起作用了：

<div class="custom-control custom-checkbox" *ngFor="let airline of airlines;let i = $index;">
                  <input type="checkbox" id="airline{{i}}" (click)="airLineFilter($event)" value="{{airline}}" name="{{airline}}" class="custom-control-input">
                  <label class="custom-control-label" for="airline{{i}}">{{airline}}</label>
                </div>

ngFor中的click事件在Angular 7中不起作用

1 个答案: