0

我正在尝试将用 AngularJS1 编写的组件升级到 Angular6。在我的示例中,我正在通过扩展放置在文件夹“ directive-wrappers ”下的“ UpgradeComponent ”来为所有现有的 AngularJS1 组件提供包装器。当我尝试添加一些没有任何指令的控制器时,我收到错误消息

Error: [$injector:unpr] Unknown provider: testDirective2DirectiveProvider <- testDirective2Directive
https://errors.angularjs.org/1.7.8/$injector/unpr?p0=testDirective2DirectiveProvider%20%3C-%20testDirective2Directive
    at eval (angular.js:138)
    at eval (angular.js:4924)
    at Object.getService [as get] (angular.js:5084)
    at eval (angular.js:4929)
    at Object.getService [as get] (angular.js:5084)
    at Function.UpgradeHelper.getDirective (upgrade_helper.ts:56)
    at new UpgradeHelper (upgrade_helper.ts:52)
    at TestDirective2Wrapper.UpgradeComponent (upgrade_component.ts:106)
    at new TestDirective2Wrapper (TestDirective2Wrapper.ts:27)
    at createClass (provider.ts:265) "<app-root _nghost-c69="">"

我尝试添加 studentController 和 homePageController,但无法加载它。任何想法为什么我会面临这个问题? https://stackblitz.com/edit/ng6hybrid-c8h6uv

4

1 回答 1

0

有两个问题需要解决。首先,在 studentController.js 文件中,您正在使用var mainApp = angular.module("testApp", []);重置 AngularJS 模块的语法,并且之前实例化的所有内容都将被删除。

要回答您关于控制器的问题,AngularJS 控制器不能直接使用UpgradeComponent(请参阅https://angular.io/guide/upgrade#using-angularjs-component-directives-from-angular-code)升级,因为它们不是具有模板的组件/指令。这就是为什么您得到的错误(在解决第一个问题之后)是Unknown provider: studentControllerDirectiveProvider <- studentControllerDirective. 它找不到参考 studentController 的指令,因此它正在添加指令以查看是否有任何内容。

要解决这个问题,要么将 AngularJS 中的控制器转换为带有模板的指令,要么将其转换为 AngularJS 中的服务,然后使用UpgradeModule. 请记住,您将需要一个用于此控制器的模板,以便可以将其升级到 Angular。请在下面的 stackblitz 中查看一个工作示例。

https://stackblitz.com/edit/ng6hybrid-zs6waw?file=app%2Fdirective-wrappers%2FstudentControllerWrapper.ts

于 2019-10-14T04:37:21.137 回答