Как эффективно захватить значения textarea в Angular 8?

Question

Мой компонент ниже имеет 3 функции, каждая из которых предназначена для хранения значения текстовой области внутри переменной.Учитывая, что у меня есть 3 разных текстовых пространства, как я могу переписать приведенный ниже код, чтобы сделать его более СУХИМЫМ и при этом сохранить значения в 3 различных переменных (значение1, значение2, значение3).

Компонент:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

value1 = '';
value2 = '';
value3 = '';

textareaInput1(e) {
  const element = e.target as HTMLInputElement;
  const value1 = element.value;
}

textareaInput2(e) {
  const element = e.target as HTMLInputElement;
  const value2 = element.value;
}

textareaInput3(e) {
  const element = e.target as HTMLInputElement;
  const value3 = element.value;
}

HTML:

<textarea (input)="textareaInput1($event)"></textarea>
<textarea (input)="textareaInput2($event)"></textarea>
<textarea (input)="textareaInput3($event)"></textarea>

Answer 1

Почему вы не используете это так

<textarea [(ngModel)]="value1"></textarea>