Need help with ng2-translate in RC0

Ionic Framework ionic-v3
21

No, I haven’t. I’ve only tested it in Chrome. It looks more like a generic problem to me.

22

Same here :frowning: did you manage to found something?

1 Like
23

Mmmmh I’ve the feeling that that issue could only be solved by a fix in the library aka that issue:

 https://github.com/ocombe/ng2-translate/issues/218
1 Like
24

The great @ocombe released a new version of ng2-translate (3.0.0) which is now compatible with AoT!

I tried, I’m now able to build my app (ionic build android), works fine.

However at runtime on my device I didn’t see the translations.
Could someone else give a try and give me a feedback.

That might be a problem of my project I’m guessing.

P.S.: I replace ‘ng2-translate/src/translate.service’ back with ‘ng2-translate/ng2-translate’, that works now too it seems.

P.P.S.: with “ionic serve” I still find the translations, my problem is only at runtime on a device not in debug

25

Hello @reedrichards,

Could you please show how you are importing and initializing ng2-translate 3.0?
I am not able to get “ionic build android” working.

Thanks a lot.

Cheers

26

app.module.ts:

import {TranslateModule, TranslateLoader, TranslateStaticLoader} from 'ng2-translate/ng2-translate';

...

export function exportTranslateStaticLoader(http: Http) {
    return new TranslateStaticLoader(http, 'assets/i18n', '.json');
}

@NgModule({
    declarations: [
...

],
imports: [

...
    HttpModule,
    TranslateModule.forRoot(
        {
            provide: TranslateLoader,
            useFactory: exportTranslateStaticLoader,
            deps: [Http]
        }
    )
 ]

...
1 Like
27

Thank you!
It’s now compiling. In fact it was not accepting the following line:
useFactory: (http: Http) => new TranslateStaticLoader(http, ‘/assets/i18n’, ‘.json’),

but replacing it with a reference to an exported function, like you did, is working.

28

Cool, good to hear.

And could I ask you if it works when you debug on a device?

For me it’s compiling and building but still can’t manage to load the translations while running the app on my android device…

29

I am gonna try, asap I complete the test I let you know

1 Like
30

Unfortunately, I have the same issue .
I can see the translation with ionic serve but I can’t when I debug on device.

31

:frowning:

thx for the feedback. so that means that (probably)

  1. The implementation I posted here is still not good and has to be modified

or

  1. There is still something to fix somewhere else
32

I just noticed one thing.

with:

  • ionic run android I can’t see the translation on device

but running:

  • ionic run android -l I see the translation
33

so

ionic serve => ok
ionic run android -l => ok

ionic run android => ko
running on real device (at least with crosswalk) => ko

I added some alert in my first view. Seems that translateService is not null.
When I ask translateService for the current lang the service gave me back the right answer.

But when I asks ‘this.translateService.instant(‘KEY’)’ I’ve got ‘KEY’ as answer and when I try to find with ‘this.translateService.get(‘KEY’).subscribe((something:any) => alert(something));’ I never get anything back

P.S.: with “ko” I mean no translation found

P.P.S.: To be sure I implemented using the same approach a translation example in the ionic2 RC starter app and face the same results

34

Hi, i am switching from natvie Swift development to hybrid development.

And i have problem with translation, i have in my app.module.ts

@NgModule({
  declarations: [
    MyApp,
    TabsController,
    HomePage
  ],
  imports: [
    IonicModule.forRoot(MyApp),
    HttpModule,
    TranslateModule.forRoot({
      provide: TranslateLoader,
      useFactory: (http: Http) => new TranslateStaticLoader(http, '/assets/i18n', '.json'),
      deps: [Http]
    })
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    TabsController,
    HomePage
  ],
  providers: []
})

Then i have created folder assets/i18n in src project folder. I created there two files cs.json and en.json.
Which contains

{
"hello": "Ahojky"
}

and

{
"hello": "Hi"
}

then in home.html i have this notation

{{ "hello" | translate }}

But hello is not translated. In javascript console is no error, and compilation using ionic is without error too.

navigator.language.split('-')[0]

gives me “cs” string.

35

@Pakit @reedrichards Try using assets/i18n as the path instead (remove the slash at the beginning).

Remember that URLs in Cordova Android are like file:///android_asset/assets/i18n/en.json, so if you use an absolute path instead of a relative one it will try to load file:///assets/i18n/en.json, which doesn’t exist and will give you a 404 error.

5 Likes
36

Fck of course, that was even correct in my Beta 11 project. Thx a lot sir for pointing that!

@Funn3r @Pakit should be the same for your, sorry for my mistake.

1 Like
37

No problem! Glad to help :slight_smile:

1 Like
38

I changed the path, but i doesn’t help.
I am testing it via “ionic serve”, i hope it doesn’t matter if i am using browser or device.

39

And @Funn3r when you use a function for the factory (see above…):

useFactory: exportTranslateStaticLoader,
40

yep, that’s was the issue.

Tnx a lot! :wink: