使用Angular 4.4.6在开发人员模式下没有提供NgForm错误的提供程序

Question

编辑：我发现是什么原因引起的问题；我现在正在寻找一种解决方案，以解决这一问题。

注意：此问题在开发人员模式下发生（即，不是prod，并且未使用aot）

我从这里使用“更新”解决方案：

/sf/answers/3242683041/

解决子组件中的输入未更新表单上的有效标志的问题。它可以在一个相当简单的测试项目中工作，但是当将其移至我们的真实项目时，会引发以下错误：

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成员？

Answer 1

是的，您可以提供它null，以防万一没有父NgForm提供者：

export function controlContainerFactory(controlContainer?: ControlContainer) {
  return controlContainer;
}

...

viewProviders: [ 
  { 
    provide: ControlContainer, 
    useFactory: controlContainerFactory, 
    deps: [[new Optional(), NgForm]] 
             ^^^^^^^^^^
          should do the trick
  } 
]

Stackblitz示例