一.选择正确的组件库选用正确的组件库能让你的开发事半功倍，material里面是没有carousel的，所以我选择ng-zorro。

二.ng-zorro表单这里我使用的框架是ng-zorro，模板代码如下:记住密码登陆注意到三点：我们通过绑定[formGroup

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

基于简单、实用性等考虑，项目中使用了Lombok、Jpa、Java8等技术，加上Ng-Alain优秀的前端脚手架系统、Ng-Zorro丰富前端组件、SpringBoot作为后台JavaRestApi服务

angular服务端渲染此项目未使用ng-zorro基本准备创建一个angular项目，ngnew项目名运行ngadd@nguniversal/express-engine--clientProject

就算强如NG-ZORRO，虽然99%的情况下已经足够丰富，足够强大，足够恰当，但总有%1的情况，你会希望它能这样、或者那样就好了。很多项目组都有“封装”组件的优良传统。

采用ng-alain自定义组件官方文档地址：https://ng-alain.com/form/custom/zh注意：如果你属性名为name,则对应sf-template="name"代码如下：html：ts:最终效果：

问题：表格固定表头，增加滚动条，导致表格内列头和内容错位解决办法指定th的nzWidth属性序号工序描述标准工时(分钟)工序级别标准工价(元)操作{{i+1}}{{data.desc}}{{data.sam}}{{data.grade}}{{data.price}}删除修改后：

效果代码//初始化菜单//res.menu是一个Menu数组//在后端创建子菜单res.menu.push({text:"",i18n:"子菜单",acl:"",});letindex=res.menu.length-1;res.menu[index].children=[];res.menu[index].children.push({text:"导航1",i18n:"menu1",acl:""

升级命令npming-zorro-antdngaddng-zorro-antdng-zorro-antd1.8+的版本图标使用方法存在差异，我们需要按照新的标准对项目的图标进行调整，命令如下nggng-zorro-antd:fix-icon调整后建议重新启动程序，如果还存在图标不能正常的情况，可以按照新的标准有针对性的修改。项目github地址：https://github.com/ZhouRen

demo.jeesite.com/js/a/...菜单管理列表页只实现增、删、改新增菜单：去除归属模块字段，其他不变难点：1，菜单列表页的表格树解决方案：手动实现，树转数组2，菜单的树结构展示解决方案：升级ng-zorro

.wrap{flex:1;padding:0;}.right-shade{width:600px;height:100vh;position:absolute;right:0;background:rgba(0,0,0,0.3);}登录账号登录-->.login{//width:100%;//会导致出现margin:0auto;后两侧margin不固定（增大）width:530px;//一定要设置

编号名称总数{{data.id}}{{data.name}}{{data.count}}import{Component,OnInit}from'@angular/core';import{BrowserModule}from'@angular/platform-browser';import{ViserModule}from'viser-ng';import{TableDataService}f

自己用了ng-zorro的组件去写。

这是html。查看官网[nzFormat]是个字符串，只能定义一个固定的格式。解决办法：通过(ngModelChange)对应的方法，在ts文件中获取前台点击改变的日期数据，然后修改dateRange的值达到改变格式的效果。利用[(ngModel)]的双向特性。（相关工作2年多了，第一个博客，因为百度了半天没解决办法，自己想到的。可能对于大神没啥，自己还是很开心的）另外查看官网时，感觉应该有另一种

由于ant-zorro组件库里的表格，直接使用splice修改无法生效需要稍微改下写法这里是定义方法的地方,依旧使用的是splice和unshift方法/***@description数组两个元素换位子*@paramarr传入的数组，index1，index2交换位置的元素*/exportfunctionswapArr(arr:any[],index1:number,index2:number){

'nz-table'isnotaknownelement:1.If'nz-table'isanAngularcomponent,thenverifythatitispartofthismodule.类似的，要在自己建的子模块里加入NgZorroAntdModule像这样

基于Angular的UI框架：NG-ZORRONG-ZORRO是AntDesign的Angular实现,NG-ZORRO由阿里计算平台事业部、阿里云等不同部门的一些小伙伴在原业务组件的基础上共同构建而成

1、使用NG-ZORRO的modal来动态添加commponent时居然提示我NzModalRef未引入包，以及modal.afterClose和modal.afterOpen未定义，明明是按着官网的例子来写的

异步数据加载点击展开节点，动态加载数据，直到执行addChildren()方法取消加载状态。import{Component}from'@angular/core';import{NzFormatEmitEvent,NzTreeNode}from'ng-zorro-antd';@Component({selector:'nz-demo-tree-dynamic',template:``})expo

查看NG-ZORRO的官方文档，关于分页功能，文档中只列出一些基本的功能，但是没有提到如何监听分页点击和分页每页条数变化。

前言：随着Angular的深入发展，组件库开始涌现，比较成形的有两种：primeNG和ng-zorro，当然在最开始Angular自身就有自己的组件库，Boostrap也与之相结合，产生相应的组件库，下面随着小编来看看

参考文档：https://blog.csdn.net/z_robot/article/details/104983557#comments_12054948ng-alain文档中使用第三方类库除了NG-ZORRO

sort时数据必须要先筛选this.eData.filter((item:any)=>item!==null)不然不成功

Angular2.0—构建项目的流程以及使用ng-zorrong-zorroy官网：https://ng.ant.design/docs/introduce/zh1.安装脚手架使用@angular/cli前，务必确认Node.js已经升级到v8.10或以上，强烈建议升级至最新版本的@angular/cli。如果你想了解更多CLI工具链的功能和命令，建议访问AngularCLI了解更多。$npmin

Angular2.0—服务首先使用脚手架创建项目友情链接：Angular2.0—构建项目的流程以及使用ng-zorro创建组件home友情链接：Angular2.0—路由跳转3.编写代码服务类似于插件，

基于简单、实用性等考虑，项目中使用了Lombok、Jpa、Java8等技术，加上Ng-Alain优秀的前端脚手架系统、Ng-Zorro丰富前端组件、SpringBoot作为后台JavaRestApi服务

基于简单、实用性等考虑，项目中使用了Lombok、Jpa、Java8等技术，加上Ng-Alain优秀的前端脚手架系统、Ng-Zorro丰富前端组件、SpringBoot作为后台JavaRestApi服务

ng-alian在ng-alain中，使用ng-zorro图标库，发现部分能正常显示，部分并不能显示，在控制台同时发现出错报错。

ng-alian在ng-alain中，使用ng-zorro图标库，发现部分能正常显示，部分并不能显示，在控制台同时发现出错报错。

本示例前提表示你已经搭建好angular运行的环境，并且已经创建好了ng-zorro项目，而且能够正常运行，接下来只是在这些基础上怎么动态的操作表格树上的节点。

访问地址：https://zhtt.gitee.io/angular-demo/ng-zorro/dist/ng-zorro/#/list/drag-table安装依赖npmigreat-ngform-

目录angular核心页面介绍NG-ZORRO组件是angular的一种UI组件，相比JQuery的css、js、html页面，angular的风格更类似后端的springmvc架构。

分享一个最近在做的一个前端项目，前端选型Angular，组件库选择的是ng-zorro(官网：http://ng.ant.design/docs/introduce/zh)。

很多时候，官网给的模板不适合我们的需求，这里是我对官网对话框的样式修改官网样式：1、修改宽度具体代码：import{Component}from'@angular/core';ShowModal//只加nzWidth属性，其他不变ContentoneContenttwoContentthreeContentthreeexportclassNzDemoModalBasicComponent{isVi

在angular项目里使用antd组件库的table组件1、改变对齐方式::ng-deepth,td{text-align:center;}2、修改宽度代码：年份cccbbbaa附件操作3、没有数据时，显示暂无数据代码：……//或者……花里胡哨的暂无数据listOfData=[{key:'1',name:'JohnBrown',age:32,address:'NewYorkNo.1LakePark

今天开始学习NG-ZORRO这个UI框架，过程中遇到了许多问题，这里把一些问题记录下来，方便后续查阅。NG-ZORRO由阿里大神们开源，给angular开发者提供了极大的便利。

angular6+(ng-zorro)框架实现前台分页import{Component,OnInit}from'@angular/core';@Component({selector:'app-header

遇到问题展示：1.点击分页时：2.然后弹框会动态缩小，3.然后列表数据重新渲染解决办法在nz-table中增加[nzFrontPagination]=falsenzFrontPagination：是否在前端对数据进行分页，如果在服务器分页数据或者需要在前端显示全部数据时传入false默认为true

最近做angular项目中，需要使用NG-Zorro中的tree，遇到一些坑。

效果ng-zorro官方链接：https://ng.ant.design/components/spin/zh上图是靠按钮来决定spin的显示与隐藏，但在我们项目里，却是要根据请求时间来决定spin的显示与隐藏

我在angular项目里要使用Switch开关，第一次使用antd里的开关，记录下：效果：后台返回的数据：看isUpload，如果返回true，就是上报。返回false，就是不上报。根据true和false来决定开关的走向代码实现：1、引入antd步骤：https://ng.ant.design/docs/getting-started/zh2、使用////扩展https://ng.ant.des

前提：我使用的是angular-cil做的项目组件库用的是ng-zorro实现的效果是：显示总条数、可跳转到其他页（两个按钮同样有效）、可改变每页条数具体步骤如下：1、使表格的分页隐藏，避免重复（我用的使表格

前言最近在学习Angular，一些基础的语法也学习的差不多了，就在github上新建了一个代码仓库，准备用ng-zorro搭个后台应用的模板，方便自己以后写些小东西时可以直接使用。

使用angular4与ng-zorro是产生的错误经过查阅和尝试解决办法如下：[email protected]安装[email protected]版本我的项目angular\cli默认安装的是3.0.4

简单总结下最近工作中的事情主要工作由于年后调离的原部门，现在在新的部门，现在这一段时间主要是进行ng-zorro的开发。主要是前段页面，对于一个我从来没写过前端和ng-zorro的人来说。有点痛苦的。

一直以来我对angular有种初恋情人的感觉，关与初恋我就不过多的解释了，可能是天意吧，所工作过得两家公司都在使用angular，只不过一家使用的是angular1.0版本，而另一家用的则是angular全新的4.0版本，在我看来，两者之间的区别在于，组件化，模块化的系统性，这是大的来说，细的说区别在于全新，以后在更新时，再说全新的全新在于那，2.0版本之后。我想angular开发团队，更加重视组

node版本更新由于公司要用NG-ZORRO，于是我就跑到官网先看看demo，怎么构建项目，执行的过程中发现了问题问题描述执行官网构建项目命令安装脚手架工具#$npminstall-g@angular/

Upload更多请看这里>https://ng.ant.design/components/upload/zh本文为angular小白的爬坑日记今天要实现upload上传图片的功能然鹅一个一个坑首先先贴上ng-zorro

想要了解Upload更多请看这里->https://ng.ant.design/components/upload/zh本文注重实现，并补充说明所用知识点~背景：获取图片并在列表中显示缩略图且可预览图片，可向列表中添加新的图片或删除图片。先上代码：test.component.tsimport{Component,OnInit}from'@angular/core';import{UploadFi