关于angular引入ng-zorro的问题浅析

193 阅读 0 评论 128 点赞

我是靠谱客的博主执着皮皮虾，最近开发中收集的这篇文章主要介绍关于angular引入ng-zorro的问题浅析，觉得挺不错的，现在分享给大家，希望可以做个参考。

ng-zorro的官网上提供了两种在项目中添加ng-zorro的方法，下面记录其提供的第二种自行构建的方式。

第一步：执行该命令创建新的angular项目，若没安装angular/cli请执行安装

ng new new-project

第二步：添加ng-zorro

npm install ng-zorro-antd --save

第三步：引入模块

在app.module.ts文件中引入

import { NgZorroAntdModule } from 'ng-zorro-antd';

......
imports: [ 
BrowserModule,
FormsModule,
HttpClientModule,
BrowserAnimationsModule,
/** 导入 ng-zorro-antd 模块 **/ 
NgZorroAntdModule
]
......

第四步：在 angular.json 文件中引入样式

{ 
"assets": [
... 
], 
"styles": [ 
... 
"node_modules/ng-zorro-antd/ng-zorro-antd.min.css"
] }

第五步：在入口style.css或者style.less文件下引入组件样式

@import "~ng-zorro-antd/style/index.min.css"; /* 引入基本样式 */
@import "~ng-zorro-antd/button/style/index.min.css"; /* 引入组件样式 */

或

@import "~ng-zorro-antd/style/entry.less"; /* 引入基本样式 */
@import "~ng-zorro-antd/button/style/entry.less"; /* 引入组件样式 */

然后在所需要的组件中使用ng-zorro就可正常使用了。

总结

到此这篇关于关于angular引入ng-zorro的问题的文章就介绍到这了,更多相关angular引入ng-zorr问题内容请搜索靠谱客以前的文章或继续浏览下面的相关文章希望大家以后多多支持靠谱客！

以上就是执着皮皮虾为你收集整理的关于angular引入ng-zorro的问题浅析的全部内容，希望文章能够帮你解决关于angular引入ng-zorro的问题浅析所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。