Hide Reset Button If Input is empty

Question

I am new in angular, so I would need help with a simple code. I have a button that clears the value of an input field.

I would like it (the button) to be hidden if input field is empty and vice versa (visible if there is text inside the input field).

The solution can be The simpler, the better.

<input matInput [formControl]="resetcontrol">
<button *ngIf="isEditable && (!!resetconrol.value)" (click)="reset()" >reset</button>

Answer 1

You can simply use/customize this code -

<input [(ngModel)]='inputValue' />
<button>Submit</button>
<button *ngIf='inputValue' (click)='inputValue = ""'>Clear</button>

Working Example