Angular不能在外部库中使用HttpClient

Question

当我尝试HttpClient在外部库中实例化服务,然后在Angular应用程序中使用该库时,我收到StaticInjectorError错误:

使用Angular 5.0.0:

AppComponent_Host.ngfactory.js? [sm]:1 ERROR Error:
  StaticInjectorError[InjectionToken DocumentToken]:   
  StaticInjectorError[InjectionToken DocumentToken]: 
     NullInjectorError: No provider for InjectionToken DocumentToken!
     at _NullInjector.get (core.js:993)
     at resolveToken (core.js:1281)
     at tryResolveToken (core.js:1223)
     at StaticInjector.get (core.js:1094)
     at resolveToken (core.js:1281)
     at tryResolveToken (core.js:1223)
     at StaticInjector.get (core.js:1094)
     at resolveNgModuleDep (core.js:10878)
     at _createClass (core.js:10919)
     at _createProviderInstance$1 (core.js:10889)

使用Angular 5.2.0-rc.0:

ERROR Error: StaticInjectorError(AppModule)[HttpXsrfTokenExtractor ->
InjectionToken DocumentToken]:    StaticInjectorError(Platform:
core)[HttpXsrfTokenExtractor -> InjectionToken DocumentToken]: 
    NullInjectorError: No provider for InjectionToken DocumentToken!
    at _NullInjector.get (core.js:994)
    at resolveToken (core.js:1292)
    at tryResolveToken (core.js:1234)
    at StaticInjector.get (core.js:1102)
    at resolveToken (core.js:1292)
    at tryResolveToken (core.js:1234)
    at StaticInjector.get (core.js:1102)
    at resolveNgModuleDep (core.js:10836)
    at _createClass (core.js:10877)
    at _createProviderInstance$1 (core.js:10847)

我用一个空白的@angular/cli应用程序重现了这个,它从angular-library-starter导入一个空白的库种子,它只是导入并尝试使用HttpClient:

(为简洁而截断的导入行)

申请app.module.ts::

@NgModule({
  declarations: [ AppComponent ],
  imports: [ ..., ArithmeticModule.forRoot() ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

申请app.component.ts::

@Component({
  ...
})
export class AppComponent {
  constructor(private sum: SumService) {}
}

对于库,我所做的只是HttpClientModule在库模块中导入,然后尝试将其注入SumService:

图书馆arithmetic.module.ts:

@NgModule({
    imports: [ HttpClientModule ]
})
export class ArithmeticModule {
    public static forRoot(): ModuleWithProviders {
        return {
            ngModule: ArithmeticModule,
            providers: [ SumService ]
        };
    }
}

图书馆sum.service.ts:

@Injectable()
export class SumService {
  constructor(private http: HttpClient) {}
  ....
}

此设置会导致StaticInjectorError帖子顶部提到的错误.

• 在汇总配置中,我添加了@angular/common/http/ ng.common.http作为外部/全局.
• 我已尝试过许多不同的设置,库种子,汇总和webpack.这一切都导致了同样的问题.

有任何想法吗？

Answer 1

我遇到了类似的问题并修复了升级 NgxMaskModule (2.2.2) 并在模块导入中添加了 NgxMaskModule.forRoot() 。