问题描述
编辑:我发现了导致问题的原因;我现在正在寻找一种解决方案,以适应这种情况.
I've discovered what is causing the problem; I'm now looking for a solution as to how to cater for it.
注意:此问题是在开发人员模式下发生的(即不是prod,并且未使用aot)
NOTE: This issue is happening in dev mode (i.e. not prod, and not using aot)
我在这里使用更新"解决方案:
I'm using the "Update" solution from here:
https://stackoverflow.com/a/46324043/3164070
解决子组件中的输入未更新表单上的有效标志的问题.它可以在一个相当简单的测试项目中工作,但是当将其移至我们的真实项目时,会引发以下错误:
To solve an issue with an input in a child component that was not updating the valid flag on the form. It works in a fairly simple test project, however when moving it to our real project, it throws this error:
core.es5.js:1020 ERROR Error: Uncaught (in promise): Error: No provider for NgForm!
Error: No provider for NgForm!
at ZoneAwareError (http://192.168.2.34:4200/vendor.bundle.js:153804:33)
at injectionError (http://192.168.2.34:4200/vendor.bundle.js:1378:90)
at noProviderError (http://192.168.2.34:4200/vendor.bundle.js:1416:12)
at ReflectiveInjector_._throwOrNull (http://192.168.2.34:4200/vendor.bundle.js:2858:19)
at ReflectiveInjector_._getByKeyDefault (http://192.168.2.34:4200/vendor.bundle.js:2897:25)
at ReflectiveInjector_._getByKey (http://192.168.2.34:4200/vendor.bundle.js:2829:25)
at ReflectiveInjector_.get (http://192.168.2.34:4200/vendor.bundle.js:2698:21)
at resolveNgModuleDep (http://192.168.2.34:4200/vendor.bundle.js:9701:25)
at NgModuleRef_.get (http://192.168.2.34:4200/vendor.bundle.js:10771:16)
at resolveDep (http://192.168.2.34:4200/vendor.bundle.js:11259:45)
at _createProviderInstance (http://192.168.2.34:4200/vendor.bundle.js:11102:20)
at resolveDep (http://192.168.2.34:4200/vendor.bundle.js:11238:56)
at createClass (http://192.168.2.34:4200/vendor.bundle.js:11129:32)
at createDirectiveInstance (http://192.168.2.34:4200/vendor.bundle.js:10960:37)
at createViewNodes (http://192.168.2.34:4200/vendor.bundle.js:12401:53)
at ZoneAwareError (http://192.168.2.34:4200/vendor.bundle.js:153804:33)
at injectionError (http://192.168.2.34:4200/vendor.bundle.js:1378:90)
at noProviderError (http://192.168.2.34:4200/vendor.bundle.js:1416:12)
at ReflectiveInjector_._throwOrNull (http://192.168.2.34:4200/vendor.bundle.js:2858:19)
at ReflectiveInjector_._getByKeyDefault (http://192.168.2.34:4200/vendor.bundle.js:2897:25)
at ReflectiveInjector_._getByKey (http://192.168.2.34:4200/vendor.bundle.js:2829:25)
at ReflectiveInjector_.get (http://192.168.2.34:4200/vendor.bundle.js:2698:21)
at resolveNgModuleDep (http://192.168.2.34:4200/vendor.bundle.js:9701:25)
at NgModuleRef_.get (http://192.168.2.34:4200/vendor.bundle.js:10771:16)
at resolveDep (http://192.168.2.34:4200/vendor.bundle.js:11259:45)
at _createProviderInstance (http://192.168.2.34:4200/vendor.bundle.js:11102:20)
at resolveDep (http://192.168.2.34:4200/vendor.bundle.js:11238:56)
at createClass (http://192.168.2.34:4200/vendor.bundle.js:11129:32)
at createDirectiveInstance (http://192.168.2.34:4200/vendor.bundle.js:10960:37)
at createViewNodes (http://192.168.2.34:4200/vendor.bundle.js:12401:53)
at resolvePromise (http://192.168.2.34:4200/vendor.bundle.js:153599:31) [angular]
at resolvePromise (http://192.168.2.34:4200/vendor.bundle.js:153570:17) [angular]
at http://192.168.2.34:4200/vendor.bundle.js:153647:17 [angular]
at Object.onInvokeTask (http://192.168.2.34:4200/vendor.bundle.js:4090:33) [angular]
at ZoneDelegate.invokeTask (http://192.168.2.34:4200/vendor.bundle.js:153284:36) [angular]
at Zone.runTask (http://192.168.2.34:4200/vendor.bundle.js:153052:47) [<root> => angular]
at drainMicroTaskQueue (http://192.168.2.34:4200/vendor.bundle.js:153480:35) [<root>]
at <anonymous> [<root>]
问题在于可以在不使用表单的情况下使用相同的组件,因此没有NgForm的提供程序.
The problem is that the same component can be used without being on a form, so there is no provider for NgForm.
在没有表单的情况下,是否存在某种动态使用viewProviders成员的方法?
Is there some way of using the viewProviders member dynamically in the case where there is no form?
推荐答案
是的,如果没有父NgForm
提供者,则可以将其作为null
提供:
Yeah, you can provide it as null
in case if there is no parent NgForm
provider:
export function controlContainerFactory(controlContainer?: ControlContainer) {
return controlContainer;
}
...
viewProviders: [
{
provide: ControlContainer,
useFactory: controlContainerFactory,
deps: [[new Optional(), NgForm]]
^^^^^^^^^^
should do the trick
}
]
Stackblitz example
这篇关于使用Angular 4.4.6在开发人员模式下没有提供NgForm错误的提供程序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!