I have a question here, which is as follows: in a form I will have 2 select boxes, the first box is free and the second box the options inside it will vary according to the first check box. I used ngIf and ngTemplate, but I could not make it appear dynamically, I need a help. My project is working on version 6 of the Angular. I gave an edited one, I put the part of the code where I get the name, I forgot that hehe, excuse me personally!
<div class="form-group">
<select class="form-control" formControlName="nome_completo">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
</div>
<div class="form-group" *ngIf="nome_completo === 'Volvo'; else op2">
<select class="form-control" formControlName="nome_usuario">
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
</div>
<ng-template #op2>
<div class="form-group">
<select class="form-control" formControlName="nome_usuario">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
</div>
</ng-template>
<div class="form-group">
<input type="password" class="form-control" placeholder="Senha" formControlName="senha">
</div>
Well, I got a solution here, but kind of messed it up, I used a change in the main select field and when it changes, it calls an event. The problem is that it only rolls when you have 2 options that influence the others, wanted to know how to supply this. Part of the html:
<div class="form-group">
<select class="form-control" formControlName="nome_completo" (change)="teste($event)">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
</div>
<div class="form-group" *ngIf="gambi === 0; else op2">
<select class="form-control" formControlName="nome_usuario">
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
</div>
<ng-template #op2>
<div class="form-group">
<select class="form-control" formControlName="nome_usuario">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</select>
</div>
Here is the part of the class:
public gambi: number = 0
public teste(event: Event): void{
if(this.gambi == 1){
this.gambi = 0;
} else {
this.gambi = 1;
}
}
And also people, I wanted to know how I can pro in the event of change, able to pass the written text of the field. Thank you in advance !!