如何在Angular 2中以编程方式设置全局表单错误？

Question

我有一个函数，可以将服务器（远程）错误追加到表单字段中。如何向表单添加全局错误（即不仅限于一个字段）？我用TODO标记了它。

import {NgForm} from 'angular2/common';

export function appendRemoteErrorsToForm(form: NgForm, modelState: Map<string, Array<string>>) {
  if (!modelState) {
    return;
  }
  let _globalKey = 'global';
  for (let key in modelState) {
    let errors = modelState[key];
    if (key !== 'global') {
      form.controls[key].setErrors({
        remote: errors
      });
    } else {
      //todo
    }
  }
}

- williamsandonz

Answer 1

我会将错误设置在与NgForm指令相关的ControlGroup上：

for (let key in modelState) {
  let errors = modelState[key];
  if (key !== 'global') {
    form.controls[key].setErrors({
      remote: errors
    });
  } else {
    form.control.setErrors({ // <-----
      remote: errors
    });
  }
}

这样，您就可以通过以下方式引用它：

<form #companyForm="ngForm">
  <div *ngIf="companyForm.control.errors">
    Display errors
  </div>
</form>

- Thierry Templier