javascript - Angularjs 到 angular4 到 angularjs

Question

我有一个正在逐步移植到 Angular 4 的应用程序。

现在，我有一些组件在 Angular 4 中，其他在 AngularJS 中。从 angularjs -> angular4 -> angularjs 传递时我遇到了一个问题。从 JS 到 4 的第一次转换工作完美，但随后，我在主屏幕上停留在我的 Angular 4 组件上。 URL 更改，但页面没有重定向到 Angular JS 组件，我的 ng-outlet 不再刷新。

ROUTER 在 angularJS 中。

Angular 4 组件降级使用:

import {
    Injectable,
    ModuleWithProviders,
    NgModule
} from '@angular/core';

import {
    APP_MODULE_NAME
} from '../../constants';

declare const angular: angular.IAngularStatic;
import {
    downgradeInjectable,
    downgradeComponent
} from '@angular/upgrade/static';


// Singleton Module
@NgModule()
@Injectable()
export class ComponentHelper {
    constructor() {}

    static forRoot(): ModuleWithProviders {
        return {
            ngModule: ComponentHelper
        }
    }

    public static DowngradeFactory(componentName: string, className: any): void {
        angular.module(APP_MODULE_NAME).factory(componentName, downgradeInjectable(className));
    }

    public static DowngradeDirective(componentName: string, className: any): void {
        angular.module(APP_MODULE_NAME).directive(componentName, downgradeComponent({
            component: className
        }))
    }
}

我在路由器上做这个

{
    path: '/pj/:project_id/ds/:datastore_id/list/ng4/all',
    component: 'downgradeNG4',
    name: 'DowngradeNG4'
}, {
    path: '/pj/:project_id/ds/:datastore_id/search/:search_id/list/all',
    name: 'NormalJS',
    component: 'normalJS'
},

在 AngularJS 的某个时刻，我这样做以便重定向到 NG4 组件。

const path = `pj/${self.projectID}/ds/${self.currentDatastoreID}/list/ng4/all`;
$location.path(path);

现在在 Angular 4 组件中，如果我单击 Angular JS 中的 UI MENU，如果浏览器中的路径发生变化，它不会重定向事件。

不是所有的组件/模块都降级了，我应该降级每个服务和子组件吗？或者只是(像现在一样)直接从 AngularJS 路由器调用的组件？

我应该将它们全部降级吗？

Answer 1

我以前参与过这个过程(从 angluarjs 迁移到 angular)。我强烈建议您再次以 Angular 6 重写所有组件(从 Angular 4 到 Angular 6 也有一些基本变化)它会比这种方法花费更少的时间。你可以保持你的 html 和 css 最小的变化。

无论如何，如果你仍然坚持你的方式。只需将其分成可以独立工作的单独部分即可。* 一个页面可以同时运行angularjs和angular

如果你需要将数据从 angularjs 传递到 angular，我会用另一种方式来做，比如使用 localstorage。

无论如何，通过您的解释很难理解问题出在哪里，即使控制台出现错误， Angular 调试也需要时间。