I have defined a static array
in TypeScript like this:
permissions: any[] = [
{ permission: "Read", enabled: true },
{ permission: "Write", enabled: false },
{ permission: "Delete", enabled: false },
{ permission: "Edit", enabled: true }
]
In my HTML, I am looping through and displaying checkboxes for each item. The checkboxes that are true
should be checked by default. However, when I change the value of the checkbox, it still reflects the initial values from TypeScript instead of the updated ones.
<h4 *ngFor="let p of permissions">
<input type="checkbox" [checked]="p.enabled">{{p.permission}}
</h4>
<button (click)="updatePermissions(permissions)">Update</button>
In the TypeScript file, I am logging the permissions to the console.
updatePermissions(permissions){
console.log(permissions);
}