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

Commit

Permalink
docs(README): how to write a HashTranslateLoader
Browse files Browse the repository at this point in the history
* Howto write a HashTranslateLoader

In issue #25 @mlegenhausen pointed out a solution that shows a very common use-case for a custom TranslateLoader implementation.
Maybe we can extend the readme to show this (and maybe other use-cases in the future)?

Kind regards :)

* Updated to review
  • Loading branch information
seveves authored and ocombe committed Mar 16, 2018
1 parent 4f95eb6 commit 3f59877
Showing 1 changed file with 41 additions and 0 deletions.
41 changes: 41 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -69,3 +69,44 @@ export function HttpLoaderFactory(http: HttpClient) {
```

For now this loader only support the json format.

## Angular CLI/Webpack TranslateLoader Example
If you are using Angular CLI (uses webpack under the hood) you can write your own `TranslateLoader` that always loads the latest translation file available during your application build.

```typescript
// webpack-translate-loader.ts
import { TranslateLoader } from '@ngx-translate/core';
import { Observable } from 'rxjs/Observable';

export class WebpackTranslateLoader implements TranslateLoader {
getTranslation(lang: string): Observable<any> {
return Observable.fromPromise(System.import(`../assets/i18n/${lang}.json`));
}
}
```

Cause `System` will not be available you need to add it to your custom `typings.d.ts`:
```typescript
declare var System: System;
interface System {
import(request: string): Promise<any>;
}
```

Now you can use the `WebpackTranslateLoader` with your `app.module`:
```typescript
@NgModule({
bootstrap: [AppComponent],
imports: [
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useClass: WebpackTranslateLoader
}
})
]
})
export class AppModule { }
```

The disadvantage of this solution is that you have to rebuild the application everytime your translate files has changes.

0 comments on commit 3f59877

Please sign in to comment.