ng-bootstrap-轮播无法正常工作

Question

我正在测试ng-bootstrap上的所有组件，由于某种原因，我可以使轮播工作。 所有其他ng-bootstrap组件都可以正常工作。 从https://ng-bootstrap.github.io/#/components/carousel/examples输入代码后，检查结果时出现空白屏幕。

这是控制台中的错误消息。

Error: StaticInjectorError(AppModule)[AppComponent -> HttpClient]: 
  StaticInjectorError(Platform: core)[AppComponent -> HttpClient]: 
    NullInjectorError: No provider for HttpClient!
    at _NullInjector.get (core.js:1002)
    at resolveToken (core.js:1300)
    at tryResolveToken (core.js:1242)
    at StaticInjector.get (core.js:1110)
    at resolveToken (core.js:1300)
    at tryResolveToken (core.js:1242)
    at StaticInjector.get (core.js:1110)
    at resolveNgModuleDep (core.js:10854)
    at NgModuleRef_.get (core.js:12087)
    at resolveDep (core.js:12577)

这是我的“ VS代码问题”选项卡上显示的错误消息。

'Identifier 'images' is not defined. The component declaration, template variable declarations, and element references do not contain such a member'
at: '31,22'

Answer 1

因为HttpClient不可用并且Angular不知道如何解决它，所以引发此错误。

使HttpClient在应用程序中随处可见。

1. 打开根AppModule app.module.ts
2. 从@angular/common/http导入HttpClientModule符号
3. 将其添加到@NgModule.imports数组

示例app.module.ts ：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http'; // Step 2
import { CarouselModule } from 'ngx-bootstrap';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule, // Step 3
    CarouselModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 2

httpClient是一个模块，允许Angular的应用程序与API一起使用以与后端服务一起使用ng-booststrap不使用此模块，可能是因为您正在使用某些外部资源而导致此错误，无论如何使用此方法来修复它。

1. 转到您的App模块
2. 从@ angular / common / http导入HttpClientModule符号
3. 将其添加到@NgModule导入数组

 import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { HttpClientModule } from '@angular/common/http'; import { CarouselModule } from 'ngx-bootstrap'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, HttpClientModule, CarouselModule.forRoot() ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } 

在Angular中，大多数软件包必须导入到要使用它们的模块中，请始终检查软件包中的文档。