使用TranslateModule和HttpClientInMemoryWebApiModule

时间:2018-01-05 13:59:33

标签: angular angular5 angular-translate

我试图将我的角度proyect翻译和客户端包含在内存web api中。

由于我无法解决HttpClient,它们似乎有一些不兼容性。

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, LOCALE_ID, NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { routing } from './app.routing';
import { HttpClient, HttpClientModule } from '@angular/common/http';
import { FlexLayoutModule } from '@angular/flex-layout';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { AppTranslateLoader } from './misc/app.translation-loader';
import { AppErrorHandler } from './misc/app.error-handler';
import { AppLanguageService } from './misc/app-language.service';
import { HttpClientInMemoryWebApiModule } from 'angular-in-memory-web-api';
import { InMemoryDataService }  from './in-memory-data.service';



export function getLocaleId(appLanguageService: AppLanguageService) {
  const sessionLanguage = appLanguageService.getSessionLanguage();
  return sessionLanguage.localeId;
 }

@NgModule({

declarations: [
     AppComponent,
],
imports: [
   HttpClientModule,
   HttpClientInMemoryWebApiModule.forRoot(
      InMemoryDataService, { dataEncapsulation: false }
    ),
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useClass: AppTranslateLoader,
        deps: [HttpClient]
      }
    })
],
providers: [
  AppLanguageService,
  {provide: ErrorHandler, useClass: AppErrorHandler},
  {provide: LOCALE_ID, useFactory: getLocaleId, deps: 
   [AppLanguageService]}
],
 bootstrap: [AppComponent]
})
export class AppModule { }

如果我导入只是翻译,它可以工作,我不能尝试在内存中使用客户端,因为它在每个模块中使用。

我猜问题是HttpClient,因为它们都使用它,我认为它们形成了不同的模块。

执行时,在chorme控制台中,我看到此错误,并且没有显示在页面

Error: [object Object]
at viewWrappedDebugError (core.js:9790)
at callWithDebugContext (core.js:15100)
at Object.debugCreateRootView [as createRootView] (core.js:14373)
at ComponentFactory_.create (core.js:11260)
at ComponentFactoryBoundToModule.create (core.js:4031)
at ApplicationRef.bootstrap (core.js:5855)
at eval (core.js:5582)
at Array.forEach (<anonymous>)
at PlatformRef._moduleDoBootstrap (core.js:5582)
at eval (core.js:5503)

Error: [object Object]
at viewWrappedDebugError (core.js:9790)
at callWithDebugContext (core.js:15100)
at Object.debugCreateRootView [as createRootView] (core.js:14373)
at ComponentFactory_.create (core.js:11260)
at ComponentFactoryBoundToModule.create (core.js:4031)
at ApplicationRef.bootstrap (core.js:5855)
at eval (core.js:5582)
at Array.forEach (<anonymous>)
at PlatformRef._moduleDoBootstrap (core.js:5582)
at eval (core.js:5503)

1 个答案:

答案 0 :(得分:2)

我找到了解决方案,为HttpClientInMemoryWebApiModule添加属性是必要的:

HttpClientInMemoryWebApiModule.forRoot(
   InMemoryDataService, {  passThruUnknownUrl: true, dataEncapsulation: false }
),

它有效!