具有角度的MdBootstrap

Question

如何使用Angular进行自举材料设计.

这是我到目前为止所尝试的.我正在使用cli来构建我的角度项目.

angular-cli.json文件

我已经使用npm安装了MDB并将它们添加到我的angular cli json文件中.

"styles": [
        "styles.css",
        "../node_modules/mdbootstrap/css/bootstrap.css",
        "../node_modules/mdbootstrap/css/mdb.css"
      ],
      "scripts": [
        "../node_modules/mdbootstrap/js/jquery-3.1.1.js",
        "../node_modules/mdbootstrap/js/tether.js",
        "../node_modules/mdbootstrap/js/bootstrap.js",
        "../node_modules/mdbootstrap/js/mdb.js"
      ],

现在我将代码添加到组件中.

<button type="button" class="btn btn-warning">Warning</button>

代码不会引发错误,但点击波和单击不起作用.请帮忙

Answer 1

要在Angular中使用mdbootstrap,您应该通过npm 安装Angular版本:

npm i angular-bootstrap-md -save

也使用FontAwesome,所以一定要将它添加到你的样式:

"../node_modules/font-awesome/scss/font-awesome.scss"

最后,在你的app.module.ts中你需要包括:

import { MDBBootstrapModule } from 'angular-bootstrap-md';
import { NO_ERRORS_SCHEMA } from '@angular/core';

@NgModule({
  declarations: [
    ...
  ],
  imports: [
   ...,
    MDBBootstrapModule.forRoot()
  ],
  schemas: [NO_ERRORS_SCHEMA]
})

在github页面上查看更多信息:

https://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design