Skip to content
This repository has been archived by the owner on Nov 8, 2021. It is now read-only.

Load translations with promise, to allow preloading #30

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

baso10
Copy link

@baso10 baso10 commented Oct 8, 2017

With APP_INITIALIZER and Promise we can load translations before app is started.

Usage example:

let translateHttpLoader: TranslateHttpLoader;

export function loadTranslations(http: HttpClient) {  
      return () => httpLoaderFactory(http).preLoad("en");
}

// AoT requires an exported function for factories
export function httpLoaderFactory(http: HttpClient) {
      if(translateHttpLoader == null) {
        translateHttpLoader = new TranslateHttpLoader(http);
      }
      return translateHttpLoader;
}

@NgModule({
   imports: [...,
      TranslateModule.forRoot({
        loader: {
          provide: TranslateLoader,
          useFactory: httpLoaderFactory,
          deps: [HttpClient]
        }
      })
   ],
   declarations: [...],
   providers: [
       ..,
      {provide: APP_INITIALIZER, useFactory: loadTranslations, deps: [HttpClient], multi: true},
     ...
   ],
  bootstrap: [AppComponent]
})

export class AppModule {}

@@ -1,8 +1,11 @@
import {HttpClient} from "@angular/common/http";
import {TranslateLoader} from "@ngx-translate/core";
import "rxjs/add/operator/map";
import {Observable} from 'rxjs/Rx';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Change the import to 'rxjs/Observable'.

*/
public preLoad(lang: string): Promise<any> {
return new Promise((resolve, reject) => {
this.http.get(`${this.prefix}${lang}${this.suffix}`)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you can change the signature to:

get().subscribe(
result => ()....,
error => ()....
);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

in this case better to use:

    public preLoad(lang: string): Promise<any> {
        return this.httpClient.get(`${this.prefix}${lang}${this.suffix}`)
            .toPromise()
            .then(result => {
                this.loadedTranslations[lang] = result;
                return result;
            })
            .catch(() => null);
    }

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

agree

@tiaguinho
Copy link
Member

@baso10 Can you make this changes?

@akaNightmare
Copy link

Guys, any updates?

@sefasenturk95
Copy link

Still no updates on this?

@@ -1,7 +1,10 @@
import {HttpClient} from "@angular/common/http";
import {TranslateLoader} from "@ngx-translate/core";
import {Observable} from 'rxjs/Observable';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This has to be imported from 'rxjs'

@gtteamamxx
Copy link

Can we push it?

@tiaguinho
Copy link
Member

@baso10 please make the changes on import and request as @akaNightmare has suggested so we can merge this into master.

@gtteamamxx
Copy link

Guys, come on :D

@tiaguinho
Copy link
Member

@ocombe can you merge this?

@thomastoledo
Copy link

We would really need this feature guys :D

@vtolstov
Copy link

ping...

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants