angular - 当子组件具有 ngModelGroup 时,没有 ControlContainer 的提供者

标签 angular angular2-forms

我似乎无法弄清楚,它根本不起作用。

这是原文plunker这是由 Pascal Prekht 编写的,它是对模板驱动表单的解释:

here是我的 fork ,它是完全相同的东西,除了我试图将其中一个字段集加载为单独的子组件。

代码如下:

@Component({
  selector:'form-group-component',
  template:`
    <fieldset ngModelGroup="anotherAddress">
      <div>
        <label>Street2:</label>
        <input type="text" name="street2" ngModel>
      </div>

    </fieldset>

  `
})
export class FormGroupComponent{

}

@Component({
  selector: 'form-component',
  directives:[FormGroupComponent],
  template: `
    <form #form="ngForm">

      <form-group-component></form-group-component>  

      <fieldset ngModelGroup="address">
        <div>
          <label>Street:</label>
          <input type="text" name="street" ngModel>
        </div>
        <div>
          <label>Zip:</label>
          <input type="text" name="zip" ngModel>
        </div>
        <div>
          <label>City:</label>
          <input type="text" name="city" ngModel>
        </div>
      </fieldset>

    </form>
  `
})
export class FormComponent {


}

所以在切割其中一个 feildsets 并将其加载到一个单独的指令中后,它将不再起作用!

有几个已解决的问题,但没有一个有效。

This This

最佳答案

我知道这是一个老问题。但是将来有人可能会发现它很有用。我遇到了同样的问题,看起来当组件有 <form> 时出现错误没有 formGroup 的标签指令和模块正在导入 ReactiveFormModule .因此,要解决此问题,请确保所有 <form>标签有 formGroup指令,如果他们的模块正在导入 ReactiveFormModule .

关于angular - 当子组件具有 ngModelGroup 时,没有 ControlContainer 的提供者,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39225106/

相关文章:

java - 在多个滚动条之间的 iframe 内滚动

angular - 在 Angular 2 模板中使用普通 POST 表单会导致 : "Template parse errors: No provider for ControlContainer"

javascript - 如何在 Angular2 的 DELETE 请求中传递参数

javascript - (Angular 2) 如何根据另一个下拉列表选择填充下拉列表

angular - 通过查询组件的模板获取 FormControl 实例

用于多种样式的 Angular ngStyle

angular - 为什么 mat-tables matRowDef 包含 2 个变量?

node.js - Angular6重命名要上传的文件

javascript - typescript rxjs : is there any clean alternative to setimeout 0

angular - 如何将 2 个条件放入 AngClass 中 Angular 2