Comments (47)
meeroslav
commented on August 20, 2024
10
Finally yes. I will implement the solution in the upcoming days.
from localize-router.
TimeTravelersHackedMe
commented on August 20, 2024
5
Looks like this is not working with nested lazy loading... top level lazy loaded components get loaded but lazy loaded components with routes declared with forChild(routes) get the "Cannot match any routes" error
Here's an example where the terms/privacy policy page work as expected but the lazy loaded module breaks with the Cannot match any routes error:
import { Location } from '@angular/common';
import { HttpClient } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { TranslateService } from '@ngx-translate/core';
import { LocalizeRouterModule, LocalizeRouterSettings, LocalizeParser } from 'localize-router';
import { LocalizeRouterHttpLoader } from 'localize-router-http-loader';
export function HttpLoaderFactory(translate: TranslateService, location: Location, settings: LocalizeRouterSettings, http: HttpClient) {
return new LocalizeRouterHttpLoader(translate, location, settings, http);
}
const routes: Routes = [
{ path: '', loadChildren: './pages/home/home-tabs/home-tabs.module#HomeTabsPageModule' },
{ path: '', loadChildren: './pages/category/category-tabs/category-tabs.module#CategoryTabsPageModule' },
{ path: 'terms', loadChildren: './pages/terms/terms.module#TermsPageModule' },
{ path: 'privacy', loadChildren: './pages/privacy-policy/privacy-policy.module#PrivacyPolicyPageModule' },
{ path: 'search', loadChildren: './pages/search/search.module#SearchPageModule' },
{ path: 'video', loadChildren: './pages/video/video.module#VideoPageModule' }
];
@NgModule({
imports: [
LocalizeRouterModule.forRoot(routes, {
parser: {
provide: LocalizeParser,
useFactory: HttpLoaderFactory,
deps: [TranslateService, Location, LocalizeRouterSettings, HttpClient]
}
}),
RouterModule.forRoot(routes)
],
exports: [LocalizeRouterModule, RouterModule]
})
export class AppRoutingModule { }
And here's the lazy loaded module's routes:
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TranslateModule } from '@ngx-translate/core';
import { LocalizeRouterModule } from 'localize-router';
import { HomeTabsPage } from './home-tabs.page';
const routes: Routes = [
{
path: 'browse',
component: HomeTabsPage,
children: [
{
path: 'popular',
children: [
{
path: '',
loadChildren: '../popular/home-popular.module#HomePopularPageModule'
}
]
},
{
path: 'latest',
children: [
{
path: '',
loadChildren: '../latest/home-latest.module#HomeLatestPageModule'
}
]
},
{
path: 'trending',
children: [
{
path: '',
loadChildren: '../trending/home-trending.module#HomeTrendingPageModule'
}
]
},
{
path: '',
redirectTo: '/browse/popular',
pathMatch: 'full'
}
]
},
{
path: '',
redirectTo: '/browse/popular',
pathMatch: 'full'
}
];
@NgModule({
imports: [
LocalizeRouterModule.forChild(routes),
RouterModule.forChild(routes),
TranslateModule
],
exports: [RouterModule]
})
export class TabsPageRoutingModule {}
from localize-router.
oxiumio
commented on August 20, 2024
4
Even if this was resolved at any point of time, there had to be a regression. As of today only top level route of a lazy-loaded module (the one with empty string path) is loaded properly, any child routes it contains resolve in Cannot match any routes error.
It would be great if we could reopen this issue @meeroslav
from localize-router.
Messilius
commented on August 20, 2024
2
A work around to this is to add a route in others translation language. If you have many languages and many subroutes that can be painfull but if like me you have to translate 2 languages, you're going to be able to use lazyloading and copy paste urls that the users can enter in the browser to arrive directly on the web page.
For Exemple:
In appModule
export const routes: Routes = [
{
path: '',
component: NavigationComponent,
children: [
{
path: 'admin', loadChildren: './+admin/admin.module#AdminModule'
},
{
path: 'users', loadChildren: './+users/users.module#UsersModule'
}
]
}
];
In submodule:
export const routes: Routes = [
{
path: '',
component: AdminComponent,
children: [
{ path: '', component: ListUserFormComponent },
{ path: 'profile/:userid', component: UserDetailComponent },
{ path: 'profile/:userid/cat/:catid', component: CatDetailComponent }, // english
{ path: 'profile/:userid/chat/:catid', component: CatDetailComponent }, // french
{ path: 'profile/:userid/cat/:catid/fur', component: FurDetailComponent }, // english
{ path: 'profile/:userid/chat/:catid/fourrure', component: FurDetailComponent } // french
]
}
];
fr.sjon :
"ROUTES.partners": "partners",
"ROUTES.cat": "chat",
"ROUTES.fur": "fourrure",
en.json:
"ROUTES.partners": "partners",
"ROUTES.cat": "cat",
"ROUTES.fur": "fur",
from localize-router.
marko999
commented on August 20, 2024
2
I have dig a little bit more why doesn't work in my case and found out that LocalizeRouterService.traverseRouteSnapshot when checking for segments is excluding paths that have 'empty' fragments as a parent...
this line:
if (snapshot.firstChild && snapshot.firstChild.routeConfig && snapshot.firstChild.routeConfig.path) {
will skip route configuration when lazy module has default route set as empty with parent component in, something like this:
const lazyRoutes: Routes = [
{
path: '',
component: ContainerComponent,
children: [
{
path: 'child1',
component: ChildComponent1
},
{
path: 'child2',
component: ChildComponent2
},
]
changeLanguage executed on the path <lazyModulePath>/child1 will not work
from localize-router.
marko999
commented on August 20, 2024
2
can we reopen this issue @meeroslav ? or I can create a new issue with repro...
from localize-router.
robinabganpat
commented on August 20, 2024
1
Currently having the same issue as mentioned here. I'm curious about the solution you came up with.
from localize-router.
samgevorgyan
commented on August 20, 2024
1
@meeroslav changeLanguage executed on the path
lazyModulePath/child1
will not work.
some news here?
from localize-router.
rafa-suagu
commented on August 20, 2024
1
@timmyrosen This library seems to be dead, we have tried all the suggested fixes in this library but none works. We already migrated to https://github.com/gilsdav/ngx-translate-router and everything works like a charm with a good maintainer support.
Also works completely with Angular Universal.
from localize-router.
2f4f4f
commented on August 20, 2024
Can you suggest a temporary workaround?
from localize-router.
meeroslav
commented on August 20, 2024
At the moment unfortunately not, except for not using lazy loading.
from localize-router.
NKjoep
commented on August 20, 2024
Hi, to me looks like it is not working with any child route.
Can you confirm?
from localize-router.
meeroslav
commented on August 20, 2024
@NKjoep What do you mean by "any child route"?
from localize-router.
NKjoep
commented on August 20, 2024
I meant not lazy loaded child route. However I think I fixed the issue I had. I ended with a broken configuration.
from localize-router.
PSTime
commented on August 20, 2024
Hi, do you have any updates for this issue ?
from localize-router.
NKjoep
commented on August 20, 2024
@Messilius thanks for the tip! have you actually tried that already? :) does it work?
from localize-router.
Messilius
commented on August 20, 2024
It work in the project im currently doing. The only thing that dont work is when there is 2 subsequent lazymodule than a lazy child. But with one layer of lazy loading and then child components it work.
from localize-router.
TaridaGeorge
commented on August 20, 2024
Any update on this? It's a problem of angular or a problem of this module?
from localize-router.
2f4f4f
commented on August 20, 2024
It's dependent on angular updating the router, here's the issue: angular/angular#16282
Latest comment from the angular team here: angular/angular#16308 (comment)
from localize-router.
commented on August 20, 2024
Dear Meeroslav,
I'm stuck with this problem of child routes and lazy loading.
Route translations is a must for multi languages website.
I have made a GIT that reproduce exactly the problem (if it can help you)...
Here is it : https://github.com/MisterEffix/localize-router-and-sub-routing
from localize-router.
NKjoep
commented on August 20, 2024
As I commented before in some other PR, if you look at this fn from the sources:
/**
* Change language and navigate to translated route
* @param lang
* @param extras
*/
LocalizeRouterService.prototype.changeLanguage = function (lang, extras) {
var _this = this;
if (lang !== this.parser.currentLang) {
var rootSnapshot_1 = this.router.routerState.snapshot.root;
this.parser.translateRoutes(lang).subscribe(function () {
_this.router.navigateByUrl(_this.traverseRouteSnapshot(rootSnapshot_1), extras);
});
}
};Everything is ok (page stays the same and translations are in place) until the _this.router.navigateByUrl() is called.
What do you think?
(ps = also I'd use a take(1) there --> this.parser.translateRoutes(lang).take(1).subscribe(...)
from localize-router.
Empereol
commented on August 20, 2024
Has there been any resolution to this?
from localize-router.
DominicBoettger
commented on August 20, 2024
My production build is always broken and i get a 404 when loading the lazyloaded frontpage. I get a 404 when loading the page. Everything works when not creating a production build.
from localize-router.
marko999
commented on August 20, 2024
any updates on this one? I mean, no pressure :)
from localize-router.
meeroslav
commented on August 20, 2024
@marko999, this bug was fixed and closed 4 days ago.
Please upgrade to version 1.0.0-rc.3 to see the changes.
If you want to see it in action, refer to demo/cli in the solution.
There will be a public github page soon.
Let me know if there is anything else I can help you with.
from localize-router.
2f4f4f
commented on August 20, 2024
Thanks for fixing the bug!
I haven't had time to check out the new version yet but do you think there will be any problems with extending your LocalizeRouterConfigLoader to catch errors from the load() method like this?
from localize-router.
meeroslav
commented on August 20, 2024
@CamusAran, it's safe to extend LocalizeRouterConfigLoaderas long as the functionality is kept. There might be problems though if some other Module creates it's own override of SystemJsNgModuleLoader and then those two end up in a race condition.
Maybe you'd like to propose improvement of the LocalizeRouterConfigLoader by adding error handler on load?
from localize-router.
2f4f4f
commented on August 20, 2024
@meeroslav I did think about suggesting that but I don't know if it is in within the scope of the package. Ideally it'd be implemented upstream but that issue is over a year old now.
What do you think?
from localize-router.
meeroslav
commented on August 20, 2024
@CamusAran generally, it's not within the scope of this package. But then again, having conflict with another loader is not desired behavior either.
If you think this error handling is still needed, we can make LocalizeRouterConfigLoader extendable and replaceable. That way you can create external package for people that need error handling.
from localize-router.
2f4f4f
commented on August 20, 2024
@meeroslav Thanks, I'll get back to you once I've had a chance to work on it (most likely next year).
from localize-router.
marko999
commented on August 20, 2024
Still doesn't work for me, changeLanguage method is breaking redirecting to default route for that module...other case when it needs a workaround is when user wants to land to lazy loaded child route, I need pathMatch: 'full' and duplicated translated route in order to make it work
from localize-router.
Empereol
commented on August 20, 2024
This also still does not work for me...
It appears once I successfully navigate to the route in one language, it will start working for the others. For instance, the route in English is results which coincides directly with the path specified in the routes ({ path: "results", component: ResultsComponent })... In this case, I can navigate to that route in English because the path string is identical to the localized route. Once I navigate there, I can then change language and it will work correctly... Even navigating away and then back in another language will now work.
But if I try to navigate to the route by the localized value (not the exact value specified in the routes.path) I get redirected as if the route doesn't exist...
url: "/fr/search-fr/resultsfr"
urlAfterRedirects: "/fr/search-fr"from localize-router.
Empereol
commented on August 20, 2024
Looking at the demo/cli example app... When I console out the instantiated LocalizeRouterService each of the routes in the object have a data.localizeRouter.path property which coincides with the path specified in the RouterModule routes.
When I do the same for my lazy loaded module, there is no data.localizeRouter.path property for each of the routes.
from localize-router.
Empereol
commented on August 20, 2024
I fixed my problem by creating explicit routing modules which get imported into the main module like the demo/cli app has done...
ex:
core-router.module.ts // module that imports and exports RouterModule and LocalizeRouterModule
core.module.ts // imports CoreRouterModuleThis did create a new issue when trying to load the lazy module... Error: StaticInjectorError[InjectionToken CompositionEventMode]:
This is currently being discussed (with a temporary fix) here: angular/angular-cli#8917 (comment)
from localize-router.
furqan-shakir
commented on August 20, 2024
I had the same issue too, it has been a year, too bad that it's not fixed yet.
from localize-router.
rafa-suagu
commented on August 20, 2024
@meeroslav some news here?
from localize-router.
wojiusihshen1
commented on August 20, 2024
I just started using Angular. Very sad to see such problem is still not fixed for more than a year. I am looking for solution for a similar problem.
lazyModulePath/:parameter
from localize-router.
Roelensdam
commented on August 20, 2024
The issue seems to come back with the upgrade to Angular 6.
I have the same issue. When changing language, the component reload (it occurs when hitting navigate or navigateByUrl in the 'changeLanguage` function)
The function : LocalizeRouterService.traverseRouteSnapshot will return a redundant url path like "fr/index/index" and then the router navigate to an unknown url => go back to home.
EDIT : After fixing the function LocalizeRouterService.traverseRouteSnapshot to return a valid url like "fr/index".
The component reload (ngOnInit is called) when a navigation occurs in the changeLanguage function :
this.router.resetConfig(this.parser.routes);
if (useNavigateMethod) {
this.router.navigate([url], extras);
} else {
this.router.navigateByUrl(url, extras);
}
from localize-router.
meeroslav
commented on August 20, 2024
The issue should be resolved in both 1.0.1 version (for Angular 4.0.0-5.2.5) and 2.0.0-RC.1 (for Angular 6/7)
There was a bug in path traversing when translating the full route.
from localize-router.
alvarofelipe12
commented on August 20, 2024
It worked for me in the version 2.0.0-RC.2 (for Angular 6/7) but it doesn't in the 2.0.0-RC.1 but i'm glad that its solved. Thanks a lot guys!
from localize-router.
timmyrosen
commented on August 20, 2024
Are there any updates on this? I'm having the same issue aswell.
Here is my lazy loaded module routing:
export const routes: Routes = [
{
path: '',
component: AuthDashboardPage,
children: [
{
path: '',
loadChildren: () => import('../reservations/reservations.module').then(m => m.ReservationsModule)
},
{
path: 'profile',
loadChildren: () => import('../profile/profile.module').then(m => m.ProfileModule)
}
]
}
];My first child route with the empty path (ReservationsModule) gets loaded correctly, but the second path "profile" does not. It redirects to the home page.
Here is my lazy loaded module:
@NgModule({
imports: [SharedModule, LocalizeRouterModule.forChild(routes), routing, ...materialModules],
exports: [],
declarations: [AuthDashboardPage],
providers: []
})
export class AuthDashboardModule {}from localize-router.
coolwoc
commented on August 20, 2024
@timmyrosen I did make it work.
Your code seems good to me at the first glaze.
Have you tried loadChild Components like
loadChildren: './core/site/static/static.module#StaticModule'
( can you try this to check! )
from localize-router.
hymenoby
commented on August 20, 2024
Hello,
Is there any fix for this problem yet ?
from localize-router.
ProfessorManhattan
commented on August 20, 2024
IIRC, I could only get it working by specifying a path for everything.
This configuration is working for me:
import { LocalizeParser, LocalizeRouterModule, LocalizeRouterSettings, ManualParserLoader } from 'localize-router';
import { RouterModule, Routes } from '@angular/router';
import { CategoryTabsPage } from '@base/pages/category/category-tabs/category-tabs.page';
import { HomeTabsPage } from '@base/pages/home/home-tabs/home-tabs.page';
import { HttpClient } from '@angular/common/http';
import { Location } from '@angular/common';
import { NgModule } from '@angular/core';
import { PredictivePreloadStrategy } from '@base/core/predictive-preload';
import { SettingsTabsPage } from '@base/pages/settings/settings-tabs/settings-tabs.page';
import { TranslateService } from '@ngx-translate/core';
import { UserTabsPage } from '@base/pages/user/user-tabs/user-tabs.page';
import { environment } from '@environment';
export function LocalizeRouterFactory(
translate: TranslateService,
location: Location,
settings: LocalizeRouterSettings,
http: HttpClient
) {
settings.alwaysSetPrefix = false;
settings.defaultLangFunction = () => {
return environment.languages.default;
};
return new ManualParserLoader(translate, location, settings, environment.languages.supported, 'ROUTES.');
}
const routes: Routes = [
{
path: 'all',
component: HomeTabsPage,
children: [
{
path: 'latest',
data: {
preload: true,
rss: true
},
children: [
{
path: '',
loadChildren: () => import('@base/pages/home/latest/home-latest.module').then(m => m.HomeLatestPageModule)
}
]
},
{
path: 'popular',
data: {
preload: true,
rss: true
},
children: [
{
path: '',
loadChildren: () =>
import('@base/pages/home/popular/home-popular.module').then(m => m.HomePopularPageModule)
}
]
},
{
path: 'trending',
data: {
preload: true,
rss: true
},
children: [
{
path: '',
loadChildren: () =>
import('@base/pages/home/trending/home-trending.module').then(m => m.HomeTrendingPageModule)
}
]
}
]
},
{
path: 'category/:topic',
component: CategoryTabsPage,
children: [
{
path: 'popular',
data: {
preload: true,
rss: true
},
children: [
{
path: '',
loadChildren: () =>
import('@base/pages/category/popular/category-popular.module').then(m => m.CategoryPopularPageModule)
}
]
},
{
path: 'latest',
data: {
rss: true,
preload: true,
delay: 15000
},
children: [
{
path: '',
loadChildren: () =>
import('@base/pages/category/latest/category-latest.module').then(m => m.CategoryLatestPageModule)
}
]
},
{
path: 'trending',
data: {
rss: true,
preload: true,
delay: 15000
},
children: [
{
path: '',
loadChildren: () =>
import('@base/pages/category/trending/category-trending.module').then(m => m.CategoryTrendingPageModule)
}
]
}
]
},
{
path: 'copyright',
data: {
ondemand: true
},
loadChildren: () => import('@base/pages/legal/copyright/copyright.module').then(m => m.CopyrightPageModule)
},
{
path: 'infringement',
data: {
ondemand: true
},
loadChildren: () => import('@base/pages/legal/infringement/infringement.module').then(m => m.InfringementPageModule)
},
{
path: 'terms',
data: { ondemand: true },
loadChildren: () => import('@base/pages/legal/terms/terms.module').then(m => m.TermsPageModule)
},
{
path: 'privacy',
data: {
ondemand: true
},
loadChildren: () =>
import('@base/pages/legal/privacy-policy/privacy-policy.module').then(m => m.PrivacyPolicyPageModule)
},
{
path: 'search/:query',
data: {
preload: true,
rss: true
},
loadChildren: () => import('@base/pages/search/search.module').then(m => m.SearchPageModule)
},
{ path: 'search', redirectTo: '/search/', pathMatch: 'full' },
{
path: 'settings',
component: SettingsTabsPage,
children: [
{
path: 'general',
children: [
{
path: '',
data: {
ondemand: true,
user: true
},
loadChildren: () =>
import('@base/pages/settings/general/settings-general.module').then(m => m.SettingsGeneralPageModule)
}
]
},
{
path: 'customize',
children: [
{
path: '',
data: {
ondemand: true,
user: true
},
loadChildren: () =>
import('@base/pages/settings/customize/settings-customize.module').then(
m => m.SettingsCustomizePageModule
)
}
]
},
{
path: 'security',
children: [
{
path: '',
data: {
ondemand: true,
user: true
},
loadChildren: () =>
import('@base/pages/settings/security/settings-security.module').then(m => m.SettingsSecurityPageModule)
}
]
}
]
},
{
path: 'user/:uid',
component: UserTabsPage,
children: [
{
path: 'favorites',
data: {
delay: 21000,
preload: true,
rss: true,
user: true
},
loadChildren: () =>
import('@base/pages/user/favorites/user-favorites.module').then(m => m.UserFavoritesPageModule)
},
{
path: 'history',
data: {
delay: 21000,
preload: true,
rss: true,
user: true
},
loadChildren: () => import('@base/pages/user/history/user-history.module').then(m => m.UserHistoryPageModule)
},
{
path: 'playlists',
data: {
delay: 21000,
preload: true,
rss: true,
user: true
},
loadChildren: () =>
import('@base/pages/user/playlists/user-playlists.module').then(m => m.UserPlaylistsPageModule)
}
]
},
{
path: 'video/:video',
loadChildren: () => import('@base/pages/video/video.module').then(m => m.VideoPageModule),
data: {
preload: true
}
},
{
path: 'welcome',
loadChildren: () => import('@base/pages/home/default/home-default.module').then(m => m.HomeDefaultPageModule),
data: {
preload: true
}
},
{
path: '',
redirectTo: '/welcome',
pathMatch: 'full'
}
];
@NgModule({
imports: [
LocalizeRouterModule.forRoot(routes, {
parser: {
provide: LocalizeParser,
useFactory: LocalizeRouterFactory,
deps: [TranslateService, Location, LocalizeRouterSettings, HttpClient]
}
}),
RouterModule.forRoot(routes, {
enableTracing: environment.enableTracing,
preloadingStrategy: PredictivePreloadStrategy
})
],
exports: [LocalizeRouterModule, RouterModule],
providers: [PredictivePreloadStrategy]
})
export class AppRoutingModule {}
And the package.json is here:
{
"name": "megabyteapp",
"version": "0.0.2",
"private": true,
"dependencies": {
"@angular/animations": "^9.0.0-rc.7",
"@angular/cdk": "^9.0.0-rc.6",
"@angular/common": "^9.0.0-rc.7",
"@angular/core": "^9.0.0-rc.7",
"@angular/fire": "^5.3.0-rc.4",
"@angular/forms": "^9.0.0-rc.7",
"@angular/material": "^9.0.0-rc.6",
"@angular/platform-browser": "^9.0.0-rc.7",
"@angular/platform-browser-dynamic": "^9.0.0-rc.7",
"@angular/platform-server": "^9.0.0-rc.7",
"@angular/router": "^9.0.0-rc.7",
"@angular/service-worker": "^9.0.0-rc.7",
"@capacitor/core": "^1.0.0",
"@ionic-native/app-availability": "^5.15.0",
"@ionic-native/core": "^5.15.0",
"@ionic-native/facebook": "^5.15.0",
"@ionic-native/firebase": "^5.15.0",
"@ionic-native/google-plus": "^5.15.0",
"@ionic-native/launch-review": "^5.19.1",
"@ionic-native/social-sharing": "^5.15.0",
"@ionic-native/splash-screen": "^5.15.0",
"@ionic-native/status-bar": "^5.15.0",
"@ionic-native/twitter-connect": "^5.15.0",
"@ionic-native/user-agent": "^5.15.0",
"@ionic/angular": "^4.11.7",
"@ionic/angular-server": "^0.0.2",
"@ionic/pro": "2.0.4",
"@ionic/storage": "^2.2.0",
"@nguniversal/express-engine": "9.0.0-next.9",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"@sentry/browser": "^5.7.1",
"algoliasearch": "^3.33.0",
"cordova-plugin-appavailability": "^0.4.2",
"cordova-plugin-facebook4": "^6.0.0",
"cordova-plugin-firebase": "^2.0.5",
"cordova-plugin-x-socialsharing": "^5.4.4",
"core-js": "^2.6.2",
"croppie": "^2.6.3",
"email-validator": "^2.0.4",
"express": "^4.15.2",
"firebase": "^7.6.1",
"linkifyjs": "^2.1.8",
"localize-router": "2.0.0-RC.3",
"localstorage-polyfill": "^1.0.1",
"lodash.debounce": "^4.0.8",
"lodash.throttle": "^4.1.1",
"md5": "^2.2.1",
"memoizee": "^0.4.14",
"moment": "^2.24.0",
"ngx-auto-unsubscribe": "^3.0.0",
"ngx-moment": "^3.5.0",
"ngx-store": "^2.1.0",
"parallax-js": "^3.1.0",
"query-string": "^6.2.0",
"rxjs": "^6.5.3",
"rxjs-compat": "^6.5.3",
"shaka-player": "^2.5.0",
"text-mask-addons": "^3.8.0",
"text-mask-core": "^5.1.2",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.900.0-rc.7",
"@angular/cli": "^9.0.0-rc.7",
"@angular/compiler": "^9.0.0-rc.7",
"@angular/compiler-cli": "^9.0.0-rc.7",
"@angular/language-service": "^9.0.0-rc.7",
"@google-cloud/translate": "^5.0.2",
"@ionic/angular-toolkit": "^2.1.1",
"@nguniversal/builders": "^9.0.0-next.9",
"@types/facebook-js-sdk": "^3.3.0",
"@types/jasmine": "~3.4.1",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"@types/webappsec-credential-management": "^0.5.1",
"cloudflare-workers-kv": "0.0.11",
"codelyzer": "^5.1.2",
"dotenv": "^8.2.0",
"edit-json-file": "^1.2.1",
"firebase-admin": "^8.9.1",
"gulp-real-favicon": "^0.3.2",
"handlebars": "^4.1.2",
"imagemin": "^7.0.1",
"imagemin-webp": "^5.1.0",
"import-sort-style-eslint": "^6.0.0",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "^2.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"npm": "^6.13.0",
"pino": "^5.13.6",
"pino-pretty": "^3.3.0",
"prettier": "^1.19.1",
"prettier-plugin-import-sort": "0.0.3",
"protractor": "~5.4.2",
"puppeteer": "^2.0.0",
"rich-logger-decorator": "^4.0.0",
"sharp": "^0.23.4",
"showdown": "^1.9.0",
"tinify": "^1.6.0-beta.2",
"ts-loader": "^6.1.2",
"ts-node": "~8.4.1",
"tslint": "^5.20.0",
"typescript": "~3.6.4",
"webpack-bundle-analyzer": "^3.5.1",
"webpack-cli": "^3.3.9"
}
}
from localize-router.
hymenoby
commented on August 20, 2024
@ProfessorManhattan This do not work in my project, i am on angular 8 and i use angular-universal for SSR , the app works fine if i dont set the initial navigation to true, bu when i do, if i try to access directly to any page other than the root page i get a route not found error
here is my package.json
{
"name": "kasania-public",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"compile:server": "webpack --config webpack.server.config.js --progress --colors",
"serve:ssr": "node dist/server",
"build:ssr": "npm run build:client-and-server-bundles && npm run compile:server",
"build:client-and-server-bundles": "ng build --prod && ng run kasania-public:server:production --bundleDependencies all"
},
"private": true,
"dependencies": {
"@agm/core": "^1.1.0",
"@agm/js-marker-clusterer": "^1.1.0",
"@angular/animations": "~8.2.14",
"@angular/cdk": "^8.2.3",
"@angular/common": "~8.2.14",
"@angular/compiler": "~8.2.14",
"@angular/core": "~8.2.14",
"@angular/forms": "~8.2.14",
"@angular/platform-browser": "~8.2.14",
"@angular/platform-browser-dynamic": "~8.2.14",
"@angular/platform-server": "~8.2.5",
"@angular/router": "~8.2.14",
"@fortawesome/angular-fontawesome": "^0.5.0",
"@fortawesome/fontawesome-svg-core": "^1.2.26",
"@fortawesome/free-brands-svg-icons": "^5.12.0",
"@fortawesome/free-solid-svg-icons": "^5.12.0",
"@ng-bootstrap/ng-bootstrap": "^5.1.5",
"@nguniversal/express-engine": "8.1.1",
"@nguniversal/module-map-ngfactory-loader": "8.1.1",
"@ngx-share/button": "^7.1.4",
"@ngx-share/buttons": "^7.1.4",
"@ngx-share/core": "^7.1.4",
"@ngx-translate/core": "^11.0.1",
"@ngx-translate/http-loader": "^4.0.0",
"@nicky-lenaers/ngx-scroll-to": "^3.0.1",
"@types/mocha": "^5.2.7",
"animate.css": "^3.7.2",
"bootstrap": "^4.4.1",
"core-js": "^3.6.4",
"express": "^4.15.2",
"font-awesome": "^4.7.0",
"hammerjs": "^2.0.8",
"intersection-observer": "^0.7.0",
"jquery": "^3.4.1",
"js-marker-clusterer": "^1.0.0",
"libphonenumber-js": "^1.7.30",
"localize-router": "^2.0.0-RC.3",
"lodash": "^4.17.15",
"moment": "^2.24.0",
"ng-lazyload-image": "^7.0.1",
"ng2-pdf-viewer": "^6.0.2",
"ngx-gallery": "^5.10.0",
"rxjs": "^6.5.4",
"slick-carousel": "^1.8.1",
"tslib": "^1.10.0",
"web-animations-js": "^2.3.2",
"zone.js": "~0.9.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.803.22",
"@angular/cli": "^8.3.22",
"@angular/compiler-cli": "~8.2.14",
"@angular/language-service": "~8.2.14",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"@types/jquery": "^3.3.31",
"@types/node": "~8.9.4",
"codelyzer": "^5.2.1",
"jasmine-core": "~3.4.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.5.1",
"protractor": "~5.4.0",
"ts-loader": "^5.2.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.5.3",
"webpack-bundle-analyzer": "^3.6.0",
"webpack-cli": "^3.1.0"
}
}
from localize-router.
rafa-suagu
commented on August 20, 2024
@ProfessorManhattan @hymenoby check my previous comment: #45 (comment)
I encourage you to migrate ASAP. This project seems to be dead and doesn't work for sure with SSR and lazy load nested routes.
from localize-router.
hymenoby
commented on August 20, 2024
@ProfessorManhattan Thanks, i will try with https://github.com/gilsdav/ngx-translate-router as you said
from localize-router.
Related Issues (20)
- localize-router not working as expected with Angular Universal: server-side rendering HOT 6
- Function traverseSnapshot not properly assembling the new translated route. HOT 11
- Localize router unable to pass data params on an empty path HOT 2
- Out of sync localize pipe HOT 1
- changeLanguage does not work for route with parameters HOT 6
- After language is switch, back button redirect into 404
- InitialNavigation enabled crashes Routing HOT 7
- Lazy loaded component is not bootstrapping HOT 4
- can't trigger window.load
- Angular 8 + IVy support HOT 1
- Can't make it, need tutorial. HOT 1
- Angular recognize only the default lang in SSR. HOT 4
- Angular 8 support HOT 6
- Extra slash translating root route
- LazyLoad Child Componenter onPage Refresh re-directs:Home Page HOT 1
- Unhandled promise rejection HOT 6
- Custom Cookies expiration
- Children routes issue lazy load module HOT 5
- Problem with Initial Navigation in RouterModule HOT 4
- LocalizeRouterModule.forRoot returns a ModuleWithProviders type without a generic type argument HOT 20
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from localize-router.