1、首先在package.json文件中加入:"bootstrap": "^4.1.3",如下图所示:

angular2中使用bootstrap样式

2、然后重新使用npm install安装,如下图所示:

angular2中使用bootstrap样式

3、此时在node_modules目录中就有一个bootstrap目录,如下图所示:

angular2中使用bootstrap样式

4、然后在angular.json中添加

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

如下图所示:

angular2中使用bootstrap样式

5、然后在html中的button按钮通过class直接使用即可,如下代码所示:

<h1>Hello {{name}}!</h1>
<p>
    Here`s a list of the things you need to do:
</p>
<ul>
    <li *ngFor="let todo of todos;index as idx;first as isFirst;last as isLast;even as isEven;odd as isOdd">索引:{{idx}},内容:{{todo}},是否是第一个:{{isFirst}},是否是最后一个:{{isLast}},是否是偶数:{{isEven}},是否是奇数:{{isOdd}}</li>
</ul>
<button (click)="click()" class="btn btn-danger">click</button>

6、最后运行结果为:

angular2中使用bootstrap样式

 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-10-02
  • 2022-12-23
  • 2021-10-03
  • 2021-10-07
  • 2021-08-05
  • 2021-11-23
猜你喜欢
  • 2022-12-23
  • 2018-05-30
  • 2021-12-12
  • 2022-12-23
  • 2021-07-12
  • 2022-12-23
  • 2021-11-17
相关资源
相似解决方案