Компоненты mdbootstrap неправильно отображают - PullRequest
0 голосов
/ 13 февраля 2019

Я работаю над проектом Angular 6, где конфигурации angular-bootstrap-md выполнены так, как указано в документации.

Мой tsconfig.json файл

{
  "compileOnSave": false,
   ......
   ......
  "include": ["src/**/*.ts", "node_modules/angular-bootstrap-md/**/*.ts"]
}

Мой angular.json файл

"styles": [
    "node_modules/font-awesome/scss/font-awesome.scss",
    "node_modules/angular-bootstrap-md/scss/bootstrap/bootstrap.scss",
    "node_modules/angular-bootstrap-md/scss/mdb-free.scss",
    "src/styles.scss"
],
 "scripts": [
  "node_modules/chart.js/dist/Chart.js",
  "node_modules/hammerjs/hammer.min.js"
]

Мой app.module.ts файл

import { MDBBootstrapModule } from 'angular-bootstrap-md';
.......
......
@NgModule({
  declarations: [
   ........
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpModule,
    BrowserAnimationsModule,
    MDBBootstrapModule.forRoot()
  ],
  providers: [.....],
  schemas: [NO_ERRORS_SCHEMA],
  bootstrap: [AppComponent]
})
export class AppModule {}

Мой MyComponent.component.html файл

<button type="button" mdbBtn color="primary" mdbWavesEffect>Primary</button>
<button type="button" mdbBtn color="secondary" mdbWavesEffect>Secondary</button>
<button type="button" mdbBtn color="success" mdbWavesEffect>Success</button>
<button type="button" mdbBtn color="danger" mdbWavesEffect>Danger</button>
<button type="button" mdbBtn color="warning" mdbWavesEffect>Warning</button>
<button type="button" mdbBtn color="info" mdbWavesEffect>Info</button>
<button type="button" mdbBtn color="light" mdbWavesEffect>Light</button>
<button type="button" mdbBtn color="dark" mdbWavesEffect>Dark</button>
<button type="button" mdbBtn color="link">Link</button>

Это должно отображать набор кнопок с различными цветами, но вместо этого просто показываеткак то так enter image description here

Есть идеи, что пошло не так?Как решить эту проблему?

...