Observem a imagem gif;
Estou trabalhando em um projeto Angular, o que preciso é ao usuário trocar de CPF para CNPJ além de realizar a troca dos campos ele possa também limpar o campo quando for trocado, não é o que acontece de acordo com a imagem.
Como faço para limpar o campo CPF e CNPJ quando eu troca o tipo de pessoa?
Eu gostaria de realizar a mudança no HTML invés de ser no componente da pagina Angular, observem o código correspondente;
<div class="form-group col-3 marginTop">
<label>Tipo de Pessoa</label>
<select name="tipoPessoa" [(ngModel)]="filtroDevedor.tipoPessoa" class="form-control">
<option value="F">CPF</option>
<option value="J">CNPJ</option>
</select>
</div>
<div class="form-group col-3 inputAjuste">
<div *ngIf="filtroDevedor.tipoPessoa == 'F'">
<label class="col-sm-12 col-form-label">CPF</label>
<div class="col-sm-12">
<input type="text" maxlength="14" mask="000.000.000-00" class="form-control" name="cpfCnpj"
[(ngModel)]="filtroDevedor.cpfCnpj" />
</div>
</div>
<div *ngIf="filtroDevedor.tipoPessoa == 'J'">
<label class="col-sm-12 col-form-label">CNPJ</label>
<div class="col-sm-12">
<input type="text" maxlength="18" mask="00.000.000/0000-00" class="form-control" name="cpfCnpj"
[(ngModel)]="filtroDevedor.cpfCnpj" />
</div>
</div>
</div>