角度5:“没有为ControlContainer提供程序"

本文介绍了角度5:“没有为ControlContainer提供程序"的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有一个带有Angular 5的小型Web应用程序，突然之间，我在浏览器控制台中收到了一条奇怪的错误消息:

I have a little web app with Angular 5 and out of a sudden I am getting this strange error message in my browser console:

ncaught Error: Template parse errors:
No provider for ControlContainer ("
</p>
<form class="container" (ngSubmit)="update()">
  [ERROR ->]<app-form-group-component
[formGroup]="additionalInformation"></app-form-group-component>
      <button "): ng:///AppModule/KickoffComponent.html@4:2

以前从未发生过，我不知道有任何更改.而且我不知道该消息试图告诉我什么.

That did not happen before and I am not aware of any made changes. And I have no idea what that message tries to tell me.

这是form-group的组件模板，该模板似乎以某种方式无效:

This is the component template of form-group which seems to be invalid somehow:

<div *ngFor='let e of formGroup' class="form-group">
<label for="{{e.key}}">{{e.label}}</label>
<input type="{{e.type}}" name="{{e.key}}"
[(ngModel)]="e.value" class="form-control"
[ngClass]='{"is-valid": e.valid === true && e.required === true}'
        />
    </div>

这是我使用form-group的模板:

And this is the template where I consume form-group:

<form class="container" (ngSubmit)="update()">
 <app-form-group-component [formGroup]="additionalInformation"></app-form-group-component>
  <button type="submit" class="btn btn-primary">Submit</button>
</form>
<app-notification [notification]="notification"></app-notification>

我盯着它看了几个小时，但我没有发现任何错误.

I stared at it for hours, but I can't find any mistake.

我应该提到的是，我不使用Angular的FormGroup，而是使用自己的解决方案(因为我认为他们的设计过度，并且不符合我的特定需求).会不会发生某种名称冲突?当然，在app.module中，我导入了FormsModule以进行双向绑定，以工作并拦截表单的提交.通知组件至少可以毫无投诉地工作.

I should mention that I don't use Angular's FormGroup but my own solution (because I thought theirs to be overengineered and it didn't fit my specific needs). Could there be some kind of name collision? Of course, in the app.module I have imported the FormsModule for two-way binding to work and to intercept the form's submit.The notification-component at least works without complaints.

我将非常感谢您的帮助.

I would be very greatful for any help.

修改:我被要求分享我的TS代码.

I was asked to share my TS code.

失败组件:

import { Component, Input } from '@angular/core';
import { FormGroup } from '../../models/form-group';

@Component({
  selector: 'app-form-group-component',
  templateUrl: './form-group.component.html',
})
export class FormGroupComponent {
  @Input() formGroup?: FormGroup
}

FormGroup 类型只是一个数组，而该组件仅是可视包装器.没有涉及其他服务或DI，并且没有该组件，Angular编译就很好.( formGroup 被标记为可选，因为TS会一直抱怨它未被初始化，尽管在运行时它将始终被初始化)

The type FormGroup is just an Array and the component is just meant to be a visual wrapper.There are no additional services involved or DI and without that component Angular compiles just fine.(formGroup is marked as optional because TS would keep complaining about it not being initialized, although at runtime it will always be initialized)

移交属性的组件:

import { Component, OnInit } from "@angular/core";
import { additionalInformation } from "./additional-information";
import { basicInformation } from "./basic-information";
...

@Component({
  selector: "app-kickoff",
  templateUrl: "./kickoff.component.html",
})
export class KickoffComponent implements OnInit {
  basicInformation: FormGroup = basicInformation;
  additionalInformation: FormGroup = additionalInformation;
  methods...
}

要回答@Andrei的问题:我没有称为ControlContainer的服务或提供程序.我只有三个小服务，它们都不会造成任何麻烦.据我所知，ControlContainer与DI有关，但是Angular关于该主题的文档相当神秘.

To answer @Andrei's question: I have no service or provider called ControlContainer. I just have three small services, none of them causes any trouble. As far as I can tell, ControlContainer has something to do with DI, but Angular's documentation on that topic is rather mystifying.

角度5

角度5:“没有为ControlContainer提供程序"

问题描述

推荐答案