How to unchecked and check the Nebular Check box dynamically after rendering

Question

I am using a nebular theme checkbox in the Angular 8 App.

 <nb-checkbox  [checked]="enable_checked" (checkedChange)="enable($event)"  >Enable </nb-checkbox>

i am updating the checkbox using "enable_checked" Boolean .When the component loaded it works fine but when I changed the value dynamically of BOOLEAN("enable_checked") it is not getting updated at the front end but the boolean is updated.

Oussail · Accepted Answer · 2020-02-27T14:07:27.353

It's working you must change it like this :

<nb-checkbox [checked]="enable_checked" (checkedChange)="enable($event)" >Enable </nb-checkbox>

<button (click)="changeCheckbox()">Set false</button>

For more information: Docs

Typescript :

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  enable_checked = true;

  changeCheckbox() {
    this.enable_checked = false
  }
}

Stackblitz Example: link

How to unchecked and check the Nebular Check box dynamically after rendering

1 Answers1