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


Posted in Javascript onSeptember 09, 2020

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问题内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
IE autocomplete internet explorer's autocomplete
Jun 30 Javascript
JavaScript高级程序设计 扩展--关于动态原型
Nov 09 Javascript
css transform 3D幻灯片特效实现步骤解读
Mar 27 Javascript
json实现前后台的相互传值详解
Jan 05 Javascript
angular基于路由控制ui-router实现系统权限控制
Sep 27 Javascript
基于原生js淡入淡出函数封装(兼容IE)
Oct 20 Javascript
jQuery EasyUI 获取tabs的实例解析
Dec 06 Javascript
如何理解jQuery中的ajaxSubmit方法
Mar 13 Javascript
Vue3.0数据响应式原理详解
Oct 09 Javascript
小程序api实现promise封装过程解析
Nov 21 Javascript
使用js获取身份证年龄的示例代码
Dec 11 Javascript
一文帮你理解PReact10.5.13源码
Apr 03 Javascript
关于vue的列表图片选中打钩操作
Sep 09 #Javascript
JavaScript日期库date-fn.js使用方法解析
Sep 09 #Javascript
js实现简单抽奖功能
Nov 24 #Javascript
js实现贪吃蛇游戏 canvas绘制地图
Sep 09 #Javascript
Vue路由 重定向和别名的区别说明
Sep 09 #Javascript
JavaScript常用8种数组去重代码实例
Sep 09 #Javascript
Vue项目配置跨域访问和代理proxy设置方式
Sep 08 #Javascript
You might like
php中array_column函数简单实现方法
2016/07/11 PHP
php实现单笔转账到支付宝功能
2018/10/09 PHP
PHP解析url并得到url参数方法总结
2018/10/11 PHP
Javascript document.referrer判断访客来源网址
2020/05/15 Javascript
使用javascript获取flash加载的百分比的实现代码
2011/05/25 Javascript
JavaScript中this的使用详解
2013/11/08 Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
2014/06/16 Javascript
ExpressJS入门实例
2015/01/14 Javascript
jQuery插件animateSlide制作多点滑动幻灯片
2015/06/11 Javascript
js实现正则匹配中文标点符号的方法
2015/12/23 Javascript
jQuery+PHP+MySQL实现无限级联下拉框效果
2016/02/19 Javascript
微信小程序 Record API详解及实例代码
2016/09/30 Javascript
微信小程序 参数传递实例代码
2017/03/20 Javascript
react ant Design手动设置表单的值操作
2020/10/31 Javascript
[52:02]完美世界DOTA2联赛PWL S2 FTD.C vs SZ 第一场 11.27
2020/11/30 DOTA
Python命令行参数解析模块optparse使用实例
2015/04/13 Python
python利用lxml读写xml格式的文件
2017/08/10 Python
Django实现auth模块下的登录注册与注销功能
2019/10/10 Python
python中图像通道分离与合并实例
2020/01/17 Python
python异步Web框架sanic的实现
2020/04/27 Python
Python3 pywin32模块安装的详细步骤
2020/05/26 Python
css和css3弹性盒模型实现元素宽度(高度)自适应
2019/05/15 HTML / CSS
HTML5应用之文件上传
2016/12/30 HTML / CSS
英国安全产品购物网站:The Safe Shop
2017/03/20 全球购物
灵泰克Java笔试题
2016/01/09 面试题
求职自荐信格式
2013/12/04 职场文书
服装厂厂长职责
2013/12/16 职场文书
仓管岗位职责范本
2014/02/08 职场文书
乡村卫生服务一体化管理实施方案
2014/03/30 职场文书
教职工代表大会主持词
2014/04/01 职场文书
运动会拉拉队口号
2014/06/09 职场文书
团日活动总结怎么写
2014/06/25 职场文书
反洗钱宣传活动总结
2014/08/26 职场文书
会计试用期自我评价
2014/09/19 职场文书
承兑汇票转让证明怎么写?
2014/11/30 职场文书
2015年大学生实习评语
2015/03/25 职场文书