capturar los valores que coloco en el input y el valor que me devuelve el index

[Beginner Web]

hola como puedo capturar el valor que estoy colocando en el texto y el indice que me esta devolviendo el let i = index en cada ngFor??? los necesito para mandarlos a aun metodo

Código (html4strict) [Seleccionar] Expandir

<div class="col-md-4 horizontal" *ngIf="iniciar">
      <div *ngFor="let item of crossword; let i = index">
        <input type="text" maxlength="1" id="input" value={{item}}> {{i}}
        <button (click)="comprobar(i)">Comprobar</button>
      </div>
      <br>
    </div>

[EdePC]

- Veo que estás utilizando id="input" entonces deduzco que quieres identificar los input que estás creando vía *ngFor, en Angular puedes hacer estos utilizando un identificador denominado Template Reference Variable que en mi ejemplo pondré: #input, él crea un identificador único para cada <input>

juego.component.html

Código (html5) [Seleccionar] Expandir

<div *ngFor="let letra of palabra; let i = index">
  <input #input type="text" maxlength="1" size="1"> {{i}}
  <button (click)="comprobar(i, input.value.toUpperCase())">Comprobar</button>
</div>

- En mi caso lo convierto a Mayúsculas antes de enviarla, además notar que he llamando letra a variable que va iterando sobre palabra donde palabra es un Array formado a partir de dividir la palabra "RAT" en sus respectivas letras (["R", "A", "T"])

juego.components.ts (dentro de la Clase principal)

Código (javascript) [Seleccionar] Expandir

  palabra: string[] = "RAT".split("")

  comprobar(i: number, letra: string): void {
    if ( this.palabra[i] === letra ) {
      console.log(`${letra} es correcto`)
    } else {
      console.log(`${letra} es incorrecto`)
    }
  }