Comments (5)
Fixed!! Super stoked!
With this fix, I can now refresh the browser without it giving me a 404 error and, more importantly, share the links with it giving the second user a 404 error.
Okay. So, it's kind of ugly... I'm using the Hash Location Strategy in this case.
Steps:
- within App.Browser.Module.ts
import { HashLocationStrategy, LocationStrategy } from "@angular/common";
and
providers: [
{provide: LocationStrategy, useClass: HashLocationStrategy}
]
Here is a look at the full app.browser.module.ts file:
import { UniversalModule } from 'angular2-universal';
import { NgModule } from '@angular/core';
import { Http } from '@angular/http';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { HashLocationStrategy, LocationStrategy } from "@angular/common";
import { AppComponent } from './app.component';
import { Routes, RouterModule } from '@angular/router';
import { HomeModule } from './home/home.module';
import { LocalizeRouterModule } from 'localize-router';
export function createTranslateLoader(http: Http) {
return new TranslateHttpLoader(http, '/assets/locales/', '.json');
}
const routes: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'users', loadChildren: './users/users.module#UsersModule' },
{ path: '**', redirectTo: 'home' }
];
@NgModule({
declarations: [
AppComponent
],
imports: [
UniversalModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [ Http ]
}
}),
RouterModule.forRoot(routes),
LocalizeRouterModule.forRoot(routes),
HomeModule
],
exports: [RouterModule],
bootstrap: [AppComponent],
providers: [
{provide: LocationStrategy, useClass: HashLocationStrategy}
]
})
export class AppModule { }
from localize-router.
Any update on this? For example, is there a working demo from a production site?
The 404 error is also encountered when refreshing the page.
Is it possible that this could be fixed via hash routing? Since, then the browser isn't looking for a domain of http://localhost:4200/en/users/Donald%20Knuth but instead is looking for the section http://localhost:4200/#/en/users/Donald%20Knuth within the domain http://localhost:4200/
Just an idea... I'm still researching.
from localize-router.
Is there any way to do with without having the hashtag?
I'll keep searching in the meanwhile as well.
from localize-router.
In your latest commit, I used the following code for the HashLocationStrategy and it works.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { Http, HttpModule } from '@angular/http';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { HashLocationStrategy, LocationStrategy } from "@angular/common";
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { HomeModule } from './home/home.module';
import {UsersModule} from "./users/users.module";
export function HttpLoaderFactory(http: Http) {
return new TranslateHttpLoader(http, '/assets/locales/', '.json');
}
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule,
HttpModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: HttpLoaderFactory,
deps: [ Http ]
}
}),
// feature modules
HomeModule,
UsersModule,
AppRoutingModule
],
providers: [
{provide: LocationStrategy, useClass: HashLocationStrategy}
],
bootstrap: [AppComponent]
})
export class AppModule { }
Thanks!
from localize-router.
@brada1703 Using a hash url isn't a solution.. You should re-open this.
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.