默认选中的复选框在 angular 中不起作用

Question

我尝试了几乎所有方法 checked、checked="true"、[checked]="true" 并在 Whosebug 上尝试了不同的答案但对我不起作用

    <ng-template #content>

    <label class="switch">
        <input  type="checkbox" name="{{day.id}}"  ngModel required #{{day.id}}="ngModel"  [checked]="true"  checked="true">
        <span class="slider round"></span>
    </label>
</ng-template>

<ng-template #other_content>

    <label class="switch">
        <input type="checkbox" name="{{day.id}}" ngModel required #{{day.id}}="ngModel">
        <span class="slider round"></span>
    </label>
</ng-template>

Answer 1

您正在注册表单控件以及 ngModel 和 name 属性。如何为模板驱动表单标记 ngModel，它可以从 ngModel、[ngModel] 或 [(ngModel)] 变化。您可以选择所需的解决方案。这里你用 ngModel 标记意味着表单控件没有值。 Angular表单不关心checked属性，而是监听表单控件有什么值！

您可以通过使用 [ngModel] 而不是 ngModel 来解决这个问题，并为该字段捕获一个 true 值，因此对于该字段更改：

<input type="checkbox" name="{{day.id}}" required #{{day.id}}="ngModel" [ngModel]="true">

默认选中的复选框在 angular 中不起作用

Default checked checkbox not working in angular

angular

checkbox

angular8

checked