具有 Angular 中预定义值的输入的数据绑定

Question

我想要一个具有电子邮件提供商价值的预定义输入表单。我的情况没有修改，在提交时，它应该将 gmail.com 值上传到 firebase 但它不会上传任何东西，除非我从输入表单中删除该值并重写。

<input class="button" value="gmail.com" formControlName="emailProvider">

谁能告诉我应该修改什么才能工作？

Answer 1

模板驱动表单：

<input class="button" [(ngModel)]="value">

class MyComponent {
  value = 'gmail.com'
}

反应形式：

<input class="button" [formControl]="ctrl">

class MyComponent {
  ctrl = new FormControl('gmail.com');
}

Answer 2

我认为这可能有用：

1) 从输入中删除值属性；

2) 在 FormGroup 实例中创建 emailProvider FormControl 时，将前者的初始值设置为 "gmail.com"

emailProvider: new FormControl('gmail.com')

通过这样做，FormControl 的初始值将为 'gmail.com' 并且应该能够被用户的输入覆盖。

Data binding of an input with a predefined value in Angular