Ant Design 的 Angular 实现,开发和服务于企业级后台产品。
^8.0.0
由于 @angular/cdk 的缘故,ng-zorro-antd 支持主要浏览器的最新两个主版本。
@angular/cdk
ng-zorro-antd
ng-zorro-antd 与 Ant Design 设计规范定期同步,你可以在线查看同步日志。
我们强烈推荐官方的 @angular/cli 工具链辅助进行开发,在实际项目开发中,它可以很好的满足对 TypeScript 代码的构建、调试、代理、打包部署等一系列工程化的需求。
@angular/cli
$ ng new PROJECT_NAME $ cd PROJECT_NAME $ ng add ng-zorro-antd
如果你想了解更多CLI工具链的功能和命令,建议访问 Angular CLI 了解更多
在每一个需要使用组件的 module 中引入 NgZorroAntdModule。
NgZorroAntdModule
import { NgZorroAntdModule } from 'ng-zorro-antd'; @NgModule({ imports: [ NgZorroAntdModule ] }) export class AppModule { }
@angular/cli 的用户不需要担心下面这项设置,但知道也挺有好处。
然后在 angular.json 文件中引入样式和 SVG icon 资源。
angular.json
{ "assets": [ + { + "glob": "**/*", + "input": "./node_modules/@ant-design/icons-angular/src/inline-svg/", + "output": "/assets/" + } ], "styles": [ + "node_modules/ng-zorro-antd/ng-zorro-antd.min.css" ] }
参考快速上手以了解更多。
$ git clone git@github.com:NG-ZORRO/ng-zorro-antd.git $ cd ng-zorro-antd $ npm install $ npm run site:start
浏览器会自动打开。