Angular 带有文本区域的表单

Question

我在对话框中使用 angular 表单来收集字符串。在下面的示例中，它们是 contact 和 reason。当我使用 input 标签时，一切都按预期工作，但我无法让 formController 绑定到 textarea。我对文档不满意。我错过了什么吗？已知的解决方法？

X.component.html

  <form [formGroup]="myForm">
      <input formControlName="contact" placeholder="contact" required/>
      <textarea placeholder="reason" formControllerName="reason" required></textarea>
  </form>

X.component.ts

import { Component } from "@angular/core";
import { FormBuilder, FormGroup, Validators} from "@angular/forms";

@Component({
  selector: 'X',
  templateUrl: 'X.component.html',
  styleUrls: ['./X.component.scss']
})
export class XDialog{
  myForm: FormGroup;

  constructor(
      private fb: FormBuilder
  ){
    this.myForm = this.fb.group({
      contact: ['', Validators.required],
      reason: ['', Validators.required],
    });
}

Answer 1

就像输入一样，textarea 使用属性 formControlName 而不是 formControllerName。

<textarea placeholder="reason" formControlName="reason" required></textarea>

这是一个工作示例：https://stackblitz.com/edit/angular-Whosebug-57597986

Angular 带有文本区域的表单

Angular Forms with a textarea

angular

angular-forms