Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Valor do radio button não reflete no component

Pessoal, alguém sabe me dizer como pegar o valor do radio selecionado em uma função no meu component? Já tentei mapear usando o container.reclamando na diretiva ngModel, sem container e não vai. O valor que é passado na chamada da função não é o mesmo exibido no ts. Estou usando o angular Material no html:

<div>
    <label class="text-primary">Depositante?</label>
    <mat-radio-group  id="reclamado" name="reclamado" (click)="carregarNomeDepositante(reclamado)"
        [(ngModel)]="reclamado"  class="theme-main-input-radio" title="Selecione o depositante">
        <mat-radio-button [value]="1"  color="primary">Reclamado</mat-radio-button>
        <mat-radio-button [value]="2"  color="accent">Reclamante</mat-radio-button>
        <mat-radio-button [value]="3"  color="warn">Outros</mat-radio-button>
    </mat-radio-group>
    <div class="example-selected-value">Despositante é: {{reclamado}}</div>
</div>

O valor exibido na linha acima "Depositante é.." é o correto, mas no component, a impressão que tenho é que ele carrega sempre a posíção anterior selecionada.

E no meu component está assim:

 carregarNomeDepositante(reclamado){
   console.log("Valor selecionado: "+ reclamado);    
  }
2 respostas
solução!

Consegui pegar, não é no evento click e sim no change, que devo acionar o metodo.

Oi Adriana, eu repliquei seu exemplo, mas sem usar o angular material. Ficou assim:

            <div>
                <label class="text-primary">Depositante?</label>
                <select  id="reclamado" name="reclamado" formControlName="reclamado" (click)="carregarNomeDepositante(reclamado)"
                    [(ngModel)]="reclamado" >
                    <option [value]="1">Reclamado</option>
                    <option [value]="2">Reclamante</option>
                    <option [value]="3" >Outros</option>
            </select>
                <div class="example-selected-value">Despositante é: {{reclamado}}</div>
            </div>

Eu só estou sando formControlName porque no formulário que eu fiz o teste eu uso o um formGroup.

O resultado foi o esperado. Será um problema no componente que você esta utilizando? Já verificou se por padrão ele não esta passando, por algum motivo, 0, 1,2, ou seja, o indice de um array? Será que ele possui outras propriedades para ser alimentado? Não consegui replicar o problema.