Angular Не удается повторно подключить ActivatedRouteSnapshot с другим числом детей - PullRequest
Новая
       3

Angular Не удается повторно подключить ActivatedRouteSnapshot с другим числом детей

3 голосов
/ 20 мая 2019

Вот моя маршрутизация в нативном текстовом проекте: 

const routes: Routes = [

    {
        path: "",
        redirectTo: "/tabs/default",
        pathMatch: "full"
    },
    {
        path: "tabs",
        loadChildren: "~/app/modules/tabs/tabs.module#TabsModule"
    },
    {
        path: "login",
        loadChildren: "~/app/modules/login/login.module#LoginModule"
    },
    {
        path: "register",
        loadChildren: "~/app/modules/register/register.module#RegisterModule"
    }

];

@NgModule({
    imports: [NativeScriptRouterModule.forRoot(routes, {
        preloadingStrategy: PreloadAllModules
    })],
    exports: [NativeScriptRouterModule]
})

Сценарий, приводящий к ошибке: сначала приложение запускается с помощью вкладки route, затем я перехожу на страницу входа, после чего иду на регистрацию, а затем снова перехожу на страницу tabs (и очищаю историю). После этого, если я снова зайду на страницу входа и вернусь к предыдущей странице (страница вкладок), произойдет ошибка.

Ошибка: 

JS: Error: Cannot reattach ActivatedRouteSnapshot with a different number of children
JS:     at setFutureSnapshotsOfActivatedRoutes (file:///data/data/org.nativescript.tns57/files/app/tns_modules/@angular/router/bundles/router.umd.js:1950:19) [angular]
JS:     at setFutureSnapshotsOfActivatedRoutes (file:///data/data/org.nativescript.tns57/files/app/tns_modules/@angular/router/bundles/router.umd.js:1954:13) [angular]
JS:     at createNode (file:///data/data/org.nativescript.tns57/files/app/tns_modules/@angular/router/bundles/router.umd.js:1935:17) [angular]
JS:     at file:///data/data/org.nativescript.tns57/files/app/tns_modules/@angular/router/bundles/router.umd.js:1975:20 [angular]
JS:     at Array.map (<anonymous>) [angular]
JS:     at createOrReuseChildren (file:///data/data/org.nativescript.tns57/files/app/tns_modules/@angular/router/bundles/router.umd.js:1958:30) [angular]
JS:     at createNode (file:///data/data/org...

Есть идеи?

Ответы [ 2 ]

0 голосов
/ 27 мая 2019

Попробуйте обновить до nativescript-angular до версии 7.2.4. Ссылка репо, которую вы опубликовали , использует версию 7.2.3, которая содержит некоторые проблемы с маршрутизацией.

https://github.com/NativeScript/nativescript-angular/pull/1740

0 голосов
/ 22 мая 2019

Попробуйте изменить первый маршрут 

{
    path: "",
    redirectTo: "tabs",
    pathMatch: "full"
}

и установите TabsModule таким образом 

const routes: Routes = [    
    {
        path: "",
        redirectTo: "default",
        pathMatch: "full"
    },
    {
        path: "default",
        component: YourDefaultComponent
    }
    ...
];

ОБНОВЛЕНИЕ: Если вы получаете ту же ошибку, выможно использовать AttachDetachReuseStrategy

import { ActivatedRouteSnapshot, RouteReuseStrategy, DetachedRouteHandle } from '@angular/router';

interface RouteStorageObject {
    snapshot: ActivatedRouteSnapshot;
    handle: DetachedRouteHandle;
}

export class CustomReuseStrategy implements RouteReuseStrategy {


    handlers: { [key: string]: RouteStorageObject } = {};

    retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
        if (!route.routeConfig) return null;
        if (route.routeConfig.loadChildren) return null;
        return this.handlers[route.routeConfig.path];
    }

    .....

}

, затем я делаю shouldDetach функцию, также проверяю loadChildren, чтобы предотвратить RouteReuseStrategy сохранить неправильно ActivatedRouteSnapshot:

shouldDetach(route: ActivatedRouteSnapshot): boolean {
    if (!route.routeConfig || route.routeConfig.loadChildren) {
        return false;
    }
    return true;
}

Конечно, измените ваш AppModule

@NgModule({
    imports: [...],
    providers: [
        {provide: RouteReuseStrategy, useClass: CustomReuseStrategy}
    ],
    ....
)}
export class AppModule {
}
...