问题标签 [angular-upgrade]

我正在通过 Angular 的升级指南学习如何将 AngularJS 组件嵌入到 Angular 应用程序中。我使用Angular CLI创建了一个简单的 Angular 应用程序，并添加了一个简单的 AngularJS 模块作为依赖项。

当我运行ng serve时，应用程序编译没有错误。但是，在运行时，我在控制台中收到此消息：

是什么导致了这个错误，我该如何避免它？我没有偏离升级指南中详述的步骤。

以下是我在 Angular 应用程序中升级 AngularJS 组件的方式：

这是我的app.module.ts：

我正在使用 Angular 5.2.0。

是否可以在 Angular 2+ 服务中使用 Angular 1.x 服务？这样做时我收到以下错误：

尝试在设置之前获取 AngularJS 注入器。

但是，如果我在 Angular 2 组件中使用 Angular 1 服务（而不是服务），它会起作用。

App.Module.ts：

A2Service.ts：

主要.ts：

将 Angular 从版本 4 升级到版本 5 后，我遇到了问题。我不能再使用httpclient了。

以下是我的 npm 包列表和package.json文件内容的屏幕截图：

我有一个可用的 rails 5.2.0 webpacker 应用程序，使用 UpgradeModule.bootstrap 函数通过 angular AppModule 启动一个最小的 angularjs 应用程序。

在将 Angular 应用程序变成混合应用程序之前，我确认它可以正常工作。在最初添加一个简单的 angularjs 混合启动模块后，angularjs 启动模块运行良好。

我现在正在尝试使用 downgradeComponent 在启动的 angularjs 根模板中挂起一个角度组件，遵循此处的文档：

https://angular.io/guide/upgrade#using-angular-components-from-angularjs-code

我需要做什么来确保将 ComponentFactoryResolver 提供给角度模块？

angular 模块仍在启动 angularjs 模块，该模块仍在工作，但使用 downgradeComponent 函数的指令失败，控制台消息提示声明组件的 angular AppModule 没有 ComponentFactoryResolver 的提供程序。

这是启动 angularjs 模块的 angular 模块，并为 HelloAngularComponent 提供了与 downgradeComponent 一起使用的入口点。错误指向这个角度（v5）打字稿文件：

这是被引导的 hello_angularjs/index.ts 模块：

以及被降级的简单组件：

首先是对项目和一般设置的简短介绍。

它是一个 Angular/Angular JS 应用程序。几周前我集成了 Angular。与使用 UpgradeModule 的许多不同教程相比，我实际上不得不使用 downgradeModule - 项目非常大，UpgradeModule 导致了很多性能问题。

有一个整体父状态（称为应用程序），我希望 Angular 组件成为它的子状态。根据文档，这应该是可能的（https://github.com/ui-router/angular-hybrid#limitations）

限制：我们目前支持将 Angular (2+) 或 AngularJS (1.x) 组件路由到 AngularJS (1.x) ui-view。但是，我们不支持将 AngularJS (1.x) 组件路由到 Angular (2+) ui-view。

如果您创建 Angular (2+) ui-view，则任何嵌套的 ui-view 也必须是 Angular (2+)。

因此，应从叶状态/视图开始迁移应用程序，然后向根状态/视图进行迁移。

一般设置如下所示（简化）：

app.module.ng1.ts

app.module.ts

TheAccountNg2Component 是我真正想去的那个。account.component.ts

有一个父应用程序状态，我希望 AccountNg2Component 成为它的子级。状态配置如下所示：

无论我尝试什么，它也会导致以下两个错误：

我可能在配置中遗漏了一些东西，但我无法弄清楚。

我已经尝试过的：

我查看了示例应用程序（https://github.com/ui-router/sample-app-angular-hybrid）并尝试构建它尽可能相似。但是他们使用的是 UpgradeModule 而不是降级 - 我不知道这是否会改变路由器的任何内容。

我试过了

• 向 UIRouterUpgradeModule.forChild() 和 UIRouterModule.forChild() 添加状态配置
• 根据https://github.com/ui-router/sample-app-angular-hybrid/blob/master/app/angularModule.ts#L10创建了一个“未来状态”
• 声明账户状态的不同方式
• 定义帐户组件本身的不同方法

错误始终保持不变，因为我认为我只是在我的配置中遗漏了一些东西。

如果我的描述没有足够的帮助，我会尝试设置一个 jsfiddle 或类似的东西

更新 1： 好的，我从 Angular 1 状态提供程序中删除了帐户状态的状态声明，而是只在 UIRouterModule 中注册它。现在至少错误消失了，但是根本没有加载状态（尝试访问它时，重定向到默认状态）

尝试从 angular 5.2 升级到 angular 6.0.0，我们遇到以下错误：

任何想法为什么？

我们使用的代码是

我正在使用 UpgradeComponent 在 Angular 5 中使用 AngularJS 组件。AngularJS 组件有一个名为“name”的绑定，它与 UpgradeComponent 上的私有变量冲突。

有没有简单的方法解决这个问题？

我正在使用将 AngularJS 项目迁移到 Angular 5，ngUpgrade但是在尝试在我的一个新组件中注入 AngularJS 服务时遇到了问题。

我遵循了Angular 的升级指南并创建了一个使用$injector（见下面的代码）的 serviceProvider，但我不断收到这个错误：

core.js:1449 错误错误：未捕获（承诺）：错误：尝试在设置之前获取 AngularJS 注入器。

我怀疑我需要使用forwardRef某个地方来解决这个问题，但我无法找出如何以及在哪里（以及为什么）。

按照升级指南的示例，我创建了一个 serviceProvider，如下所示：

ajs-升级-providers.ts：

然后我将它提供给应用程序的 NgModule：

app.module.ts：

我使用 ngUpgrade 引导该模块：

main.ts

如果我理解正确，这应该允许我直接将 AngularJS 服务注入到我的组件中，如下所示：

登录组件.ts

我可以做些什么来简化这个吗？我试图尽可能地遵循升级指南，为什么这不起作用？

我#instance在组件上尝试了通常的方法，但没有成功。我认为这会起作用，因为输入和输出仍然可以使用[]and ()。但是instance是undefined。如何从 angularjs 获取实例的引用？我需要能够在降级的角度组件中调用一个函数。

编辑：这个问题与被标记为重复的问题无关。请重新阅读并重新考虑。这个问题询问如何在 angularjs 视图中获取降级组件的实例。那个问题是问如何创建降级组件。我显然已经过了那个阶段。

我按照此处提到的步骤将我的应用程序从 angular4 升级到了 angular 5：https ://update.angular.io/

我可以毫无问题地运行 ng-serve 、 ng build 等。

但是 ng test (npm test) 失败并出现错误：

TypeScript 编译中缺少 \src\test.ts。请通过 'files' 或 'include' 属性确保它在您的 tsconfig 中。

我尝试做足够的谷歌并解决这个问题，但它们似乎都没有工作。

正如这里所建议的， https: //stackoverflow.com/a/48798373/2754029 我尝试在 angular-cli.json 和 tsconfig.json 中添加配置，但这不起作用。

任何人都可以在这里帮助我。如果您需要这方面的更多信息，请告诉我。