使用 bootstrap3 表示 Angular

Question

我正在使用angular4.0。我正在使用引导程序3.3.7。

我成功地使用了引导按钮和网格。但是，DropDown 和日期选择器不能很好地使用。

安装包。

• intl@1.2.5
• bootstrap@3.3.7
• ng-bootstrap

angular-cli.json

"styles": [
 "../node_modules/bootstrap/dist/css/bootstrap.css",
 "styles.css"
],

app.component.html

 {{title}}
  <div class="row">
   <div class="col">
    <div ngbDropdown class="d-inline-block">
      <button class="btn btn-outline-primary" id="dropdownMenu1" ngbDropdownToggle>Toggle dropdown</button>
      <div class="dropdown-menu" aria-labelledby="dropdownMenu1">
        <button class="dropdown-item">Action - 1</button>
        <button class="dropdown-item">Another Action</button>
        <button class="dropdown-item">Something else is here</button>
      </div>
    </div>
   </div>
  </div>

app.component.ts

import { Component } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app works!';
}

这个 src 制作按钮和下拉菜单。按钮成功。但是下拉失败了。

你知道为什么不能使用下拉列表和日期选择器吗？

Answer 1

如果你使用的是ng-bootstrap，你应该知道他们使用的是Bootstrap 4，所以可能存在一些类命名错误。如果你想要 Angular 2 库用于 Bootstrap 3，你可以从 Valor Software 查看 ng2-bootstrap。

Answer 2

除了Adnan所说的之外，"ng2-bootstrap"被重命名为"ngx-bootstrap";)请注意 package.json

Answer 3

问题

出在 bootstrap.css 中，因此请使用 index.hhtml 中的 (https://v4-alpha.getbootstrap.com/getting-started/introduction/(cdn 链接，因为 bootstrap4 没有 npm 包