服务器中 url 不起作用,通过服务器上的Http请求的URL必须是绝对的。 URL：./assets/i18n/en.json...

我是Angular 2的新手，我在ngx-translate组件中遇到以下问题(通过服务器上的Http请求的URL必须是绝对的。)URL：./assets/i18n /en.json)。我相信，这en.json文件是存在的，因为我做HTTP请求，并请求成功通过服务器上的Http请求的URL必须是绝对的。 URL：./assets/i18n/en.json

这里是我的app.module.server.ts文件：

import { NgModule } from '@angular/core';

import { ServerModule } from '@angular/platform-server';

import { sharedConfig } from './app.module.shared';

import { HttpModule, Http } from '@angular/http';

import {

TranslateModule,

TranslateLoader,

MissingTranslationHandler,

MissingTranslationHandlerParams

} from '@ngx-translate/core';

import { TranslateHttpLoader } from '@ngx-translate/http-loader';

export function createTranslateLoader(http: Http) {

return new TranslateHttpLoader(http, './assets/i18n/', '.json');

}

export class MyMissingTranslationHandler implements MissingTranslationHandler {

handle(params: MissingTranslationHandlerParams) {

return '[' + params.key + ']';

}

}

@NgModule({

bootstrap: sharedConfig.bootstrap,

declarations: sharedConfig.declarations,

imports: [

ServerModule,

HttpModule,

TranslateModule.forRoot({

loader: {

provide: TranslateLoader,

useFactory: (createTranslateLoader),

deps: [Http]

}

}),

...sharedConfig.imports

]

})

export class AppModule {

}

这里是我app.module.cleint.ts文件：

import { NgModule } from '@angular/core';

import { BrowserModule } from '@angular/platform-browser';

import { FormsModule } from '@angular/forms';

import { HttpModule,Http } from '@angular/http';

import { sharedConfig } from './app.module.shared';

import {

TranslateModule,

TranslateLoader,

MissingTranslationHandler,

MissingTranslationHandlerParams

} from '@ngx-translate/core';

import { TranslateHttpLoader } from '@ngx-translate/http-loader';

export function createTranslateLoader(http: Http) {

return new TranslateHttpLoader(http, './assets/i18n/', '.json');

}

export class MyMissingTranslationHandler implements MissingTranslationHandler {

handle(params: MissingTranslationHandlerParams) {

return '[' + params.key + ']';

}

}

@NgModule({

bootstrap: sharedConfig.bootstrap,

declarations: sharedConfig.declarations,

imports: [

BrowserModule,

FormsModule,

HttpModule,

TranslateModule.forRoot({

loader: {

provide: TranslateLoader,

useFactory: (createTranslateLoader),

deps: [Http]

}

}),

...sharedConfig.imports

],

providers: [

{ provide: 'ORIGIN_URL', useValue: location.origin },

{

provide: MissingTranslationHandler,

useClass: MyMissingTranslationHandler

}

]

})

export class AppModule {

}

，这里是我的app.module.shared.ts文件：

import { NgModule } from '@angular/core';

import { RouterModule } from '@angular/router';

import { HttpModule, Http } from "@angular/http";

import { BrowserModule } from "@angular/platform-browser";

import { TranslateModule} from '@ngx-translate/core';

import { AppComponent } from './components/app/app.component'

import { NavMenuComponent } from './components/navmenu/navmenu.component';

import { HomeComponent } from './components/home/home.component';

import { FetchDataComponent } from './components/fetchdata/fetchdata.component';

import { EmployeesListComponent } from './components/employees/EmployeesList.component';

import { CounterComponent } from './components/counter/counter.component';

export const sharedConfig: NgModule = {

bootstrap: [AppComponent],

declarations: [

AppComponent,

NavMenuComponent,

CounterComponent,

FetchDataComponent,

EmployeesListComponent,

HomeComponent

],

imports: [

RouterModule.forRoot([

{ path: '', redirectTo: 'home', pathMatch: 'full' },

{ path: 'home', component: HomeComponent },

{ path: 'counter', component: CounterComponent },

{ path: 'fetch-data', component: FetchDataComponent },

{ path: 'employees-list', component: EmployeesListComponent },

{ path: '**', redirectTo: 'home' }

]),

BrowserModule,

HttpModule,TranslateModule

]

, exports: [

TranslateModule

]

};

2017-06-17

Mohammad

+0

请阅读[在什么情况下，我可以添加“紧急”或其他类似的短语到我的问题，以获得更快的答案？](/ meta.stackoverflow.com/q/326569) - 总结是，这不是解决志愿者问题的理想方式，而且可能对获得答案起反作用。请不要将这添加到您的问题。 –