使用 iframe 将 AngularJS 迁移到 Angular 8



所以,我的客户希望我将他的AngularJS页面迁移到最新的Angular 8框架。 但他也想为当前的AngularJS应用程序添加一些功能。 工作流程如下: 1. 将 AngularJS 迁移到 Angular 8 2. 当旧代码中有新内容时,门槛维护旧的 Angular JS 应用程序。

该应用具有静态标头导航。所以我的想法是在 Angular 8 中构建标头,并通过 iframe 将旧的 Angular JS 应用程序放入 Angular 8 的根目录。 因此,当用户点击 Angular 8 应用程序中的导航时,他会获得正确的 Angular JS 应用程序的路由器,该应用程序将在 Angular 8 应用程序的 iframe 中渲染。

因此,这背后的想法是逐页迁移页面,但如果需要,仍保留旧的 AngularJS 应用程序。

这可能吗?

我希望有人可以帮助我。

此致敬意

首先对于迁移,我建议您使用此迁移指南

其次,我开发了一个同时使用 Angular Js 和 angular8 的应用程序,我遇到的唯一问题是根,我无法在 angular 中使用路由。

我是怎么做到的?

我通过<script></script>在同一个 jsp 中调用了角度 js 和转置的角度 8 文件 这是我的jsp的一个例子,它有一个叫做pointe的angular 8应用程序,以及一个名为employee

<%@ include file="init.jsp" %>
<link rel="stylesheet" href="/angulars/pointe/styles.css"/>
<app-root></app-root>
<script src="/angulars/pointe/runtime-es2015.js" type="module"></script>
<script src="/angulars/pointe/runtime-es5.js" nomodule defer></script>
<script src="/angulars/pointe/polyfills-es5.js" nomodule defer></script>
<script src="/angulars/pointe/polyfills-es2015.js" type="module"></script>
<script src="/angulars/pointe/scripts.js" defer></script>
<script src="/angulars/pointe/main-es2015.js" type="module"></script>
<script src="/angulars/pointe/main-es5.js" nomodule defer></script>
<script src="/angulars/employee/js/angular.js"></script>
<script src="/angulars/employee/js/app.js"></script>

我认为如果您将脚本加载到 iframe 中,它也可以工作, 但是无论如何,您必须将所有这些代码包装在一个容器中。

最后,我真的不建议你这样做,因为我在 angular js 和 angular 8 中加载的库遇到了很多麻烦

最新更新