Angular 4 - получить входное значение

Я хотел бы знать, как получить значение из входа на angular 4. Я просмотрел документацию на angular, и пример с ключевым событием не очень хорошо работает для меня, и я не могу найти подходящий пример, как сделайте это, пожалуйста, помогите мне

Проблема: я пытаюсь прочитать входное значение и после отправки значения другому компоненту, который добавит значение к тегу выбора (например, отправить имя человека в список для тега выбора)

Ответ 1

<form (submit)="onSubmit()">
   <input [(ngModel)]="playerName">
</form>

let playerName: string;
onSubmit() {
  return this.playerName;
}

Ответ 2

В HTML добавить

<input (keyup)="onKey($event)">

И в компоненте Добавить

onKey(event) {const inputValue = event.target.value;}

Ответ 3

Если вы не хотите использовать двустороннюю привязку данных. Вы можете сделать это.

В HTML

<form (ngSubmit)="onSubmit($event)">
   <input name="player" value="Name">
</form>

В компоненте

onSubmit(event: any) {
   return event.target.player.value;
}

Ответ 4

Я думаю, что вы планировали использовать угловую переменную шаблона на основе вашего HTML-шаблона.

 // in html
 <input #nameInput type="text" class="form-control" placeholder=''/>

 // in add-player.ts file
 import { OnInit, ViewChild, ElementRef } from '@angular/core';

 export class AddPlayerComponent implements OnInit {
   @ViewChild('nameInput') nameInput: ElementRef;

   constructor() { }

   ngOnInit() { }

   addPlayer() {
     // you can access the input value via the following syntax.
     console.log('player name: ', this.nameInput.nativeElement.value);
   }
 }

Ответ 5

HTML

<input type="hidden" #fondovalor value="valores">
     <button (click)="getFotoFondo()">Obtener</button>

Т.С.

@ViewChild('fondovalor') fondovalor:ElementRef;

getFotoFondo(){ 
        const valueInput = this.fondovalor.nativeElement.value
}