Issue
<form [formGroup]="calculateForm">
<div class="form-group row">
<p for="inputFrom" class="col-sm-4">Distance traveled(km):</p>
<div class="col-sm-4">
<input type="text" numbersOnly class="form-control form-control-md"
formControlName="distance">
</div>
</div>
<button type="button" (click)="calculate()" class="btn btn-success">{{'Save | translate }}</button>
</div>
</div>
<br>
</form>
I want after fill the form and click Save button, the form will be non editable, only can see. Just one time fill in.I tried readonly but it for before click Button.
Solution
to disable the form you can just call the this.calculateForm.disable()
. To do so for the save button as well use in your function calculate
a flag to disable the button when it's clicked. First introduce a new variable containing a boolean
named isDisabled
. You can bind to the disabled
attribute of the DOM element with binding syntax. <button [disabled]="isDisabled" type="button" (click)="calculate()" class="btn btn-success">{{'Save | translate }}</button>
. Set the isDisabled
variable in the calculate function
to true and the button which is bind to the variable will be disabled.
Answered By - Burak Ayyildiz
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.