How to pass value from textarea?

Question

Angular

Hello!
I have already tried everything I could, both reactive forms and NgForm, and even I don’t understand! How to get values ​​entered in textarea?

<form *ngFor="let tasks of task">
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Name</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea1" rows="1">{{tasks.name}}</textarea>
  </div>
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Creation date</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea2" rows="1">{{tasks.creation_date}}</textarea>
  </div>
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Due date</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea3" rows="1" >{{tasks.due_date}}</textarea>
  </div>
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Physical progress</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea4" rows="1">{{tasks.physical_progress}}%</textarea>
  </div>
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Status</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea5" rows="1" >{{tasks.obj_status}}</textarea>
  </div>
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Description</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea6" rows="7">{{tasks.description}}</textarea>
  </div>
  <div class="input-group mb-3">
    <div class="input-group-prepend">
      <span class="input-group-text">Tags</span>
    </div>
    <textarea class="form-control" id="exampleFormControlTextarea7" rows="1">{{tasks.tags}}</textarea>
  </div>

  <div>
    <h3><a [routerLink]="''">Back</a></h3>
    <h3><a (click)="Onclick()" [routerLink]="''">Save</a></h3>
  </div>
</form>

*.ts

import {Component, Input, OnInit} from '@angular/core';
import {TasksModels} from '../Models/tasks.models';
import {ActivatedRoute} from '@angular/router';
import {TasksServices} from '../Services/tasks.services';

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


export class TasksCorrectComponent implements OnInit {
  @Input()
  id: any;
  task: TasksModels[] = [];

  constructor(private router: ActivatedRoute, private taskService: TasksServices) {
  }
  Onclick(){console.log(1)}
  ngOnInit() {
    this.id = this.router.snapshot.params['id'];
    console.log(this.id);
    this.taskService.GetTasks().subscribe(obj => {
      this.task = obj.filter(c => c.id == this.id);
      console.log(this.task);
    });
  }

}