Angular custom-control-input 在循环内的 formControlName 中无法正常工作

Question

我想在 Angular 上应用自定义主题样式，但复选框无法正常工作。

我有这部分代码并且工作得很好：

<tr *ngFor="let item of lists let i=index" [formGroupName]="i">
    <td>
        <div class="form-group">
            <div class="custom-control custom-switch">
                <input type="checkbox" class="form-control" id="field_check"  formControlName="checked">
                <label class="form-control-label"  for="field_check">check</label>
            </div>
        </div>
    </td>
</tr>

但是当我尝试添加自定义类控件时不起作用：

<tr *ngFor="let item of lists let i=index" [formGroupName]="i">
    <td>
        <div class="form-group">
            <div class="custom-control custom-switch">
                <input type="checkbox" class="custom-control-input" id="field_check" formControlName="checked">
                <label class="custom-control-label"  for="field_check">check</label>
            </div>
        </div>
    </td>
</tr>

如何在不丢失class="form-control" 的情况下应用我的class="custom-control-input"？我已经尝试过这个class="form-control custom-control-input" 但没有用

更新

检查元素后我发现了这个：

所以当这是我得到的结果时：

我无法访问 css 代码 custom-control-input 和 form-control how 我可以解决这个问题吗？

Answer 1

它应该可以正常工作，最好是你可以使用检查元素查看控件应用了哪种样式。可能它被表单控制类覆盖。你可能不得不使用！在课堂上很重要。