Angular 4 ngform 未能检索到值答案

【问题标题】：Angular 4 ngform failed to retrieve the valueAngular 4 ngform 未能检索到值
【发布时间】：2018-02-17 08:59:02
【问题描述】：

我在 Angular 4 中创建了一个表单，其中一个字段数据是从外部 js 文件中获取的。在js文件中，我这样做了

    document.getDocumentById('fieldname').value = someValue;

该值已填充在屏幕上，但是当我点击提交按钮时，我注意到特定字段值是空的。

这是我在 Angular TypeScripts 中检索表单值的代码。

 @ViewChild('f') theForm: NgForm;
     onSubmit() {
            this.fieldname = this.theForm.value.contractData.fieldname;
    }

模板驱动

    <form (ngSubmit)="onSubmit()" #f="ngForm">
 <div
          id="contract-data"
          ngModelGroup="contractData"
          #userData="ngModelGroup">
        <div class="col-md-6">
                <label for="fieldname">fieldname :</label>
                <input
                  type="text"
                  id="fieldname"
                  class="form-control"
                  ngModel
                  name="fieldname"
                required  [ngModel]="fieldname"
                >
              </div>
    </div>
    </form>

提前致谢

【问题讨论】：

请添加更多代码，如何实例化表单？反应式还是模板驱动？
@DanielNetzer - 我用的是模板驱动的方法，上面已经放了组件代码。
表单标签在哪里？
@DanielNetzer - 我很确定表单初始化工作正常，因为表单中有五个字段，只有从外部 js 文件获取值的字段名不起作用。
@DanielNetzer - 上面显示的表单标签。

标签： angular typescript angular2-forms

【解决方案1】：

我通过在 Angular 中使用 Reactive 表单解决了这个问题，并将 FormGroup.patch 用于特定的输入字段。现在可以了！

【讨论】：