Miguel Frias
Miguel Frias

Reputation: 2710

Angular material slide toggle does not change after init form

im working angular material components and for some reason, when i initialize the from and set the formcontrol value to true on the component, the mat-slide-toggle is not set on the template and is always off / false.

Template

<form [formGroup]="form" novalidate>
    <mat-slide-toggle class="mp-slide-toggle" e2e="edit-service-visibility-toggle" formControlName="visible">{{
        'global.label.visible' | translate
    }}</mat-slide-toggle>
</form>

Component

readonly form = new FormGroup({
    visible: new FormControl(true),
});

but if i set the value manually like this this.form.controls.visible.setValue(true) then the toggle change, i dont want to change it manually i need the toggle to take the initial value of the form when is initialized

Upvotes: 1

Views: 823

Answers (1)

angular_code
angular_code

Reputation: 359

Do the same on the ngOnInit() method -

 ngOnInit(){
readonly form = new FormGroup({
    visible: new FormControl(true),
});

This will initialize your form fields to the one set here when the page is initially loaded everytime .

Upvotes: 1

Related Questions