模板中的angular2和formControlName值

Question

哦angular2 ......为什么这么难？

<input type="text" formControlName="exposure" type="hidden">
<label>{{exposure}}</label>

如果我在输入中使用formControlName,则值是正确的.

如何获取模板中的曝光值？它在标签上是空白的

Answer 1

该formControlName指令旨在与父FormGroupDirective(selector:)一起使用 [formGroup].

它接受FormControl您要链接的实例的字符串名称,并将FormControl在其最近FormGroup或FormArray上方查找使用该名称注册的名称.

使用form.get('exposure').value得到控制值.

例:

<form [formGroup]="form">
    <input type="text" formControlName="exposure" type="hidden">
    <label>{{ form.get('exposure').value }}</label>
</form>

另外

在组件类中,定义表示表单控件的getter属性:

export class MyComponent {
  form = new FormGroup({
    exposure: new FormControl('')
  });

  get exposure(): FormControl { return this.form.get('exposure'); }

然后,在组件模板中,您可以参考exposure:

<input type="text" formControlName="exposure" type="hidden">
<label>{{exposure.value}}</label>

Answer 2

声明一个模板变量：

<input type="text" formControlName="exposure" type="hidden" #exposure>
<label>{{ exposure.value }}</label>