使用 Angular 4.4.6 在开发模式下没有 NgForm 错误的提供者
No provider for NgForm error in dev mode using Angular 4.4.6
编辑: 我发现了导致问题的原因;我现在正在寻找如何满足它的解决方案。
注意:这个问题发生在开发模式下(即非生产,不使用 aot)
我正在使用此处的 "Update" 解决方案:
解决子组件中的输入未更新表单上的有效标志的问题。它在一个相当简单的测试项目中工作,但是当将它移动到我们的真实项目时,它会抛出这个错误:
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 的提供程序。
有没有办法在没有表单的情况下动态使用viewProviders成员?
是的,如果没有父 NgForm
提供商,您可以将其提供为 null
:
export function controlContainerFactory(controlContainer?: ControlContainer) {
return controlContainer;
}
...
viewProviders: [
{
provide: ControlContainer,
useFactory: controlContainerFactory,
deps: [[new Optional(), NgForm]]
^^^^^^^^^^
should do the trick
}
]
编辑: 我发现了导致问题的原因;我现在正在寻找如何满足它的解决方案。
注意:这个问题发生在开发模式下(即非生产,不使用 aot)
我正在使用此处的 "Update" 解决方案:
解决子组件中的输入未更新表单上的有效标志的问题。它在一个相当简单的测试项目中工作,但是当将它移动到我们的真实项目时,它会抛出这个错误:
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 的提供程序。
有没有办法在没有表单的情况下动态使用viewProviders成员?
是的,如果没有父 NgForm
提供商,您可以将其提供为 null
:
export function controlContainerFactory(controlContainer?: ControlContainer) {
return controlContainer;
}
...
viewProviders: [
{
provide: ControlContainer,
useFactory: controlContainerFactory,
deps: [[new Optional(), NgForm]]
^^^^^^^^^^
should do the trick
}
]