User956626884 posted
In my Angular Material app, I am using two controls which is textarea matInput and mat-slide-toggle. I followed the example online but somehow the ngModel is not working. For textarea I use ngModel, the data is not passed to the control. Only when I use
[value] the data is posted on the control but any changes is not reflected back on the object. For the mat-side-toggle, [(ngModel)] does not work. I have to use [checked].
How can I get dual binding working? thanks.
<mat-card >
<mat-card-content>
<div style="display:inline-block; ">
<form class="full-form-wrapper">
<mat-form-field style="width:600px;">
<textarea matInput cdkTextareaAutosize #autosize="cdkTextareaAutosize"
cdkAutosizeMinRows="4"
[formControl]="myCtrl"
[readonly]="false"
maxlength="300"
id="description"
cdkAutosizeMinRows="5"
cdkAutosizeMaxRows="5"
width="500px"
[value]="myObject.person.description"
name="description">
</textarea>
</mat-form-field>
<section class="example-section">
<mat-slide-toggle
[(ngModel)]="checked"
[color]="primary"
[checked]="myObject.person.isActive"
[disabled]="false">
Is Active {{checked}}
</mat-slide-toggle>
</section>
</form>
</div>
</mat-card-content>
</mat-card>