禁用绑定不适用于使用 *ngFor 生成的复选框

Question

我有一个要绑定到复选框的对象列表。我遇到的问题是，当我只想禁用列表中的特定复选框时，我的所有复选框都将被禁用。设置 *ngfor 和复选框的正确方法是什么？我在这里使用 PrimeNg checkbox，但如果您知道常规复选框，那将是一个有用的垫脚石。

component.ts 有这个：

 this.options = [
            { name: "A", checked: true, disabled: true },
            { name: "B", checked: false, disabled: false },
            { name: "C", checked: false, disabled: false },
        ];

component.html:

<div class="form-group row">
    <span *ngFor="let test of options; let i=index" class="col-sm-4">
        <p-checkbox binary="true" [(ngModel)]="test.checked" label="{{test.name}}"
            [ngModelOptions]="{standalone: true}" disabled="{{test.disabled}}"></p-checkbox>
    </span>
</div>

Answer 1

更改设置禁用的方式

// this will always set a disabled attribute. Problem is, as soon as the attribute exists,
//  the browser disables the input. As a result, all your inputs are disabled
disabled="{{test.disabled}}"

// this binds to the DOM property, not the element attribute. When the property is false
// the browser removes the attribute from the DOM and the input is enabled
[disabled]="test.disabled"

禁用绑定不适用于使用 *ngFor 生成的复选框

Disabled binding not working for checkboxes generated with *ngFor

angular

checkbox

primeng