Sam
Sam

Reputation: 93

Checkbox [checked] = "true" not working in angular

Trying to check the checkbox using [checked] = "true" but it is not working here is a link https://stackblitz.com/edit/angular-ivy-6qeay9?file=src/app/app.component.ts

Upvotes: 5

Views: 18145

Answers (3)

KunaRakeshKumar
KunaRakeshKumar

Reputation: 13

<input class="form-check-input" [(ngModel)]="checkedbox" [checked]="true">

Upvotes: 0

StPaulis
StPaulis

Reputation: 2916

As you can see by the following example

<input type="checkbox"  [checked]="true"> List A
<input type="checkbox" [(ngModel)]="theCheckbox" [checked]="true"> List B

The NgModel directive is higher priority from the checked property. So you may want to exclude checked and use NgModel to do what you are trying to do.

Upvotes: 7

Barremian
Barremian

Reputation: 31105

When the property is enclosed in brackets [], the RHS is assumed to be a property in the controller (*.ts file). See property binding for more info.

In your case you must simply do

checked=true

Update

I just saw the Stackblitz.

  1. Since it's <input>, it must only be checked, not checked=true.
  2. But you have a ngModel two-way binding. So you need to removed checked and set the status through the bound property theCheckbox.

Controller (*.ts)

export class AppComponent  {
  theCheckbox = true;
}

I've modified your Stackblitz

Upvotes: 3

Related Questions