Comments (3)
Hi @brada1703 ,
in the first code example you have both routerLink
and (click)
. Most likely your route gets translated with changeLang
but then navigation via routerLink
kicks in and redirects you to home.
Try to remove all routerLink bits and leave just click:
<a (click)="changeLang('en')">English</a>
<a (click)="changeLang('it')">Italiano</a>
If you need to mark active language button you can use ngx-translate's TranslateService
or localize-router LocalizeService
's parser to get current language and simply use ngClass
to mark it.
from localize-router.
Thanks again @meeroslav You're the best! 👍
You're absolutely right. The routerLink was the problem. It kept bringing me back to the homepage. Once I removed it, I realized that the problem then was the "changeLang" part.
In case anyone else is having a problem with this, let me show you what I changed.
I realized that I was importing
import { TranslateService } from '@ngx-translate/core';
instead of
import { LocalizeRouterService } from 'localize-router';
The problem here is that with @ngx-translate/core, they want to see
changeLang(lang:string){
this.translate.use(lang);
but in localize-router, your syntax is slightly different
changeLanguage(lang: string) {
this.localize.changeLanguage(lang);
}
So, I had to change the imports to 'localize-router', the constructor to
constructor(private localize: LocalizeRouterService) {}
changeLanguage(lang: string) {
this.localize.changeLanguage(lang);
}
and finally change the on click event to
(click)="changeLanguage('it')"
Now it works like a charm! 👍
from localize-router.
I used (click)="changeLanguage('en')"
and the strings are translated but the url does not update accordingly.
I am also getting Uncaught (in promise): TypeError: Cannot read property 'component' of null
when I change to another language.
Did anyone else have this problem? Please help.
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.