gilsdav / ngx-translate-router

Translate routes using ngx-translate
131 stars 43 forks source link

Bugfix/initial navigation initializer #90

Closed gilsdav closed 4 years ago

gilsdav commented 4 years ago

Based on branche https://github.com/gilsdav/ngx-translate-router/pull/88

TODO:

giacomo commented 4 years ago

@gilsdav i tried out but i dont get the actual path of the route.

export const appInitializerFactory = (injector: Injector, languageStrategyService: LanguageStrategyService) => {
    return () => {
        const localize = injector.get(LocalizeRouterService);
        return localize.hooks.initialized
            .pipe(
                tap(() => {
                    languageStrategyService.boot();
                })
            )
            .toPromise();
    };
};

both urls are empty - any hint?

boot() {
        const router = this.injector.get(Router);
        const route = this.injector.get(ActivatedRoute);

        console.log(router.url, route.snapshot.url);
}
giacomo commented 4 years ago

@gilsdav when i replace the console.log with a setTimeout router.url will display the right string

giacomo commented 4 years ago

@gilsdav seems to working great when i use:

        const router = this.injector.get(Router);

        router.events.pipe(
            filter(url => url instanceof NavigationEnd)
        ).subscribe((route: NavigationEnd) => {});

before i was using RoutesRecognized event, seems that this is not triggered anymore.

nice work! 👍

gilsdav commented 4 years ago

Thanks for your help @giacomo, This type of AppInitializer seems to work with initialNavigation:

export const appInitializerFactory = (injector: Injector) => {
  return () => {
    const localize = injector.get(LocalizeRouterService);
    return localize.hooks.initialized
      .pipe(
        switchMap(() => {
          const router = injector.get(Router);
          return router.events.pipe(
            filter(url => url instanceof NavigationEnd),
            first(),
            tap((route: NavigationEnd) => {
              console.log(router.url, route.url);
              router.navigate(['/fr/testounet/bobie']);
            })
          );
        })
      )
      .toPromise();
  }
};

and this with both (initialNavigation or not):

export const appInitializerFactory = (injector: Injector) => {
  return () => {
    const localize = injector.get(LocalizeRouterService);
    return localize.hooks.initialized
      .pipe(
        tap(() => {
          const router = injector.get(Router);
          router.events.pipe(
            filter(url => url instanceof NavigationEnd),
            first()
          ).subscribe((route: NavigationEnd) => {
            console.log(router.url, route.url);
            router.navigate(['/fr/testounet/bobie']);
          });
        })
      )
      .toPromise();
  }
};

But the two solutions got a blink when switching from a language to an other.

giacomo commented 4 years ago

@gilsdav seems to work just fine in my use case. :)