tflori / angular-translator

translation module for angular
https://tflori.github.io/angular-translator/
MIT License
21 stars 6 forks source link

Can't get angular2-translator to work #3

Closed BorntraegerMarc closed 7 years ago

BorntraegerMarc commented 7 years ago

Hi there

Somehow I always receive the following error: EXCEPTION: Unexpected token < in JSON at position 0. So maybe someone could help me out with my project config and tell me if I'm missing something? I'm using webpack at the moment...

app/app.module.ts:

import {NgModule, CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
import {BrowserModule} from '@angular/platform-browser';
import {HttpModule} from "@angular/http";
import {PolymerElement} from '@vaadin/angular2-polymer';
import {TranslateConfig, TranslatorModule, TranslateLoaderJsonConfig} from 'angular2-translator/angular2-translator';

import {AppComponent} from "./app.component";
import {AuthComponent} from "./auth/auth.component";
import {routing} from "./app.routing";
import {AuthService} from "./auth/auth.service";
import {HomeModule} from "./home/home.module";

@NgModule({
    declarations: [
        AppComponent,
        AuthComponent,
        PolymerElement('paper-icon-button')
    ],
    imports: [
        BrowserModule,
        routing,
        HttpModule,
        HomeModule,
        TranslatorModule
    ],
    providers: [{
        provide: TranslateConfig, useValue: new TranslateConfig({
            defaultLang: 'en',
            providedLangs: ['en', 'de'],
        })
    }, {
        provide: TranslateLoaderJsonConfig, useValue: new TranslateLoaderJsonConfig('i18n', '-lang.json')
    },
        AuthService
    ],
    bootstrap: [AppComponent],
    schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {

}

app.component.ts:

import {Component} from '@angular/core';
import {TranslateService} from 'angular2-translator/angular2-translator';

@Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styles: [`
    app-toolbar {
      background: var(--primary-color);
      color: var(--dark-theme-text-color);
    }
  `]
})
export class AppComponent {
    constructor(translate: TranslateService) {
        translate.translate("TEXT").then(
            (translation) => console.log(translation)
        );
    }
}

en-lang.json:

{
  "TEXT": "asdf"
}
tflori commented 7 years ago

Hi Marc, sounds like a problem with loading the json. Instead of receiving the json, the json loader get's a HTML file beginning with <. Try to check the network tab from your development tools.

Marc Bornträger notifications@github.com schrieb am Fr., 23. Dez. 2016, 01:29:

Hi there

Somehow I always receive the following error: EXCEPTION: Unexpected token < in JSON at position 0. So maybe someone could help me out with my project config and tell me if I'm missing something? I'm using webpack at the moment...

app/app.module.ts:

import {NgModule, CUSTOM_ELEMENTS_SCHEMA} from '@angular/core'; import {BrowserModule} from '@angular/platform-browser'; import {HttpModule} from "@angular/http"; import {PolymerElement} from '@vaadin/angular2-polymer'; import {TranslateConfig, TranslatorModule, TranslateLoaderJsonConfig} from 'angular2-translator/angular2-translator';

import {AppComponent} from "./app.component"; import {AuthComponent} from "./auth/auth.component"; import {routing} from "./app.routing"; import {AuthService} from "./auth/auth.service"; import {HomeModule} from "./home/home.module";

@NgModule({ declarations: [ AppComponent, AuthComponent, PolymerElement('paper-icon-button') ], imports: [ BrowserModule, routing, HttpModule, HomeModule, TranslatorModule ], providers: [{ provide: TranslateConfig, useValue: new TranslateConfig({ defaultLang: 'en', providedLangs: ['en', 'de'], }) }, { provide: TranslateLoaderJsonConfig, useValue: new TranslateLoaderJsonConfig('i18n', '-lang.json') }, AuthService ], bootstrap: [AppComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA] }) export class AppModule {

}

app.component.ts:

import {Component} from '@angular/core'; import {TranslateService} from 'angular2-translator/angular2-translator';

@Component({ selector: 'my-app', templateUrl: './app.component.html', styles: [ app-toolbar { background: var(--primary-color); color: var(--dark-theme-text-color); } ] }) export class AppComponent { constructor(translate: TranslateService) { translate.translate("TEXT").then( (translation) => console.log(translation) ); } }

en-lang.json:

{ "TEXT": "asdf" }

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/tflori/angular2-translator/issues/3, or mute the thread https://github.com/notifications/unsubscribe-auth/AEoXOyZmtkERQ7pcA65zGP7Fy6yEJt0nks5rKxXTgaJpZM4LUfiD .

BorntraegerMarc commented 7 years ago

Yep, my error. Thanks!