NathanWalker / nativescript-ng2-translate

Use ng2-translate with NativeScript + Angular2.
MIT License
6 stars 2 forks source link

Can you provide a sample of usage in latest nativescript and angular #6

Closed musso closed 7 years ago

musso commented 7 years ago

Thanks Nathan for your work in nativescript. We have recently changed from ionic to TNS.

There are number of problems encountered when using the Setup NativeScript/Angular in Readme

  1. No 'provide' module in @angular/core
  2. No 'nativeScriptBootstrap' in 'nativescript-angular/application' in latest TNS
  3. We visited angular2-seed-advanced, but the setup there is too complicated, with analytics, electrons etc.

Any simple setup for latest nativescript and angular

NathanWalker commented 7 years ago

Hi @musso thanks. This plugin is actually no longer needed. I will unpublish this soon. The latest 4.x version of ng2-translate works as is with {N}. Just use static loader as seen here: https://github.com/NathanWalker/angular-seed-advanced/blob/master/src/client/app/frameworks/i18n/multilingual.module.ts#L19 And setup here: https://github.com/NathanWalker/angular-seed-advanced/blob/master/nativescript/app/native.module.ts#L45 Which just sets up TranslateModule.

musso commented 7 years ago

Help needed!

I m using the Nativescript template of tns create projectABC --ng

Tried to follow the setup for TranslateStaticLoader at app.module.ts

`import { HttpModule, Http } from '@angular/http'; import { TranslateModule, TranslateService, TranslatePipe, TranslateLoader, TranslateStaticLoader } from 'ng2-translate';

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

@NgModule({ imports: [ NativeScriptModule, NativeScriptRouterModule, NativeScriptRouterModule.forRoot(routes), HttpModule, TranslateModule.forRoot({ provide: TranslateLoader, useFactory: (createTranslateLoader), deps: [Http] }) ], ... For some reason Injectingprivate translate : TranslateService` got the following error

  1. Is the problem of calling sth before bootstrapping? or
  2. ng-translate thinks there is a DOM but there is none in nativescript?

`CONSOLE ERROR file:///app/tns_modules/trace/trace.js:160:30: ns-renderer: ERROR BOOTSTRAPPING ANGULAR CONSOLE ERROR file:///app/tns_modules/trace/trace.js:160:30: ns-renderer: null is not an object (evaluating 'getDOM().defaultDoc')

_document@file:///app/tns_modules/@angular/platform-browser/bundles/platform-browser.umd.js:2390:24
get
get
get
get
getInternal
get@file:///app/tns_modules/@angular/core/bundles/core.umd.js:6720:42
create@file:///app/tns_modules/@angular/core/bundles/core.umd.js:5476:34
bootstrap@file:///app/tns_modules/@angular/core/bundles/core.umd.js:6550:50
forEach@[native code]
_moduleDoBootstrap@file:///app/tns_modules/@angular/core/bundles/core.umd.js:6459:53
file:///app/tns_modules/@angular/core/bundles/core.umd.js:6427:49
invoke@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:190:33
onInvoke@file:///app/tns_modules/@angular/core/bundles/core.umd.js:5975:47
invoke@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:189:42
run@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:83:49
file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:449:60
invokeTask@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:223:42
onInvokeTask@file:///app/tns_modules/@angular/core/bundles/core.umd.js:5966:51
invokeTask@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:222:54
runTask@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:123:57
drainMicroTaskQueue@file:///app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js:355:42
promiseReactionJob@[native code]
UIApplicationMain@[native code]
start@file:///app/tns_modules/application/application.js:251:30
bootstrapApp@file:///app/tns_modules/nativescript-angular/platform-common.js:67:26
bootstrapModule@file:///app/tns_modules/nativescript-angular/platform-common.js:55:26
anonymous@file:///app/main.js:4:57
evaluate@[native code]
moduleEvaluation@[native code]
[native code]
promiseReactionJob@[native code]`
musso commented 7 years ago

Somehow I managed to do it by defining the translations manually without the http and TranslateStaticLoader

translate.setTranslation('en', { HELLO: 'hello {{value}}' });

Have a happy and fruitful new year !