angular单选按钮_[Angular 组件库 NG-ZORRO 基础入门] - Table：排序 / 筛选

最新推荐文章于 2021-07-07 17:51:26 发布

weixin_39819661

最新推荐文章于 2021-07-07 17:51:26 发布

阅读量1.5k

点赞数

文章标签： angular单选按钮

本文链接：https://blog.csdn.net/weixin_39819661/article/details/111623725

版权

本文介绍了在Angular项目中使用NG-ZORRO组件库，特别是Table组件的排序和筛选功能。通过创建组件、代码分析，展示了如何开启筛选和排序功能，并解释了相关事件和参数。此外，还提供了实际的代码示例和在线资源链接，帮助开发者更好地理解和应用这些特性。

摘要由CSDN通过智能技术生成

连续几天的 待办事项 小项目开发，涉及了很多组件的使用，接下来我们就重点讲解各个组件更多的特性和使用方式，帮助大家有更好的理解。今天我们也会精选几个小例子，来一起学习 table 组件更多的功能特性。

我们之前已经知道，一个简单的 nz-table 是如何使用的（[Angular 元件庫 NG-ZORRO 基礎入門] Day 04 - 待辦事項 + Table），今天我们会介绍如下几个例子来帮助用户理解更多有意思、有帮助的使用方式及场景：

我们先来将 table 组件先创建出来：

$ cd ng-zorro-ironman2020
$ ng g c components/table --skip-import

这样我们的 components 文件夹已经完成了创建，将其加入 ComponentsModule 声明并加到 ComponentsComponent 的路由中，准备好了之后我们就开始接下来的工作。目前 components 文件夹结构如下

components
├── button
├── demos
├── layout
└── table
    ├── table.component.html
    ├── table.component.less
    └── table.component.ts

我们先来创建一个筛选和排序的例子，还记得我们之前讲过，NG-ZORRO 官方文档例子中有个 复制生成代码命令 的快捷工具吗？

点击这个按钮，cd 到 table 文件夹下粘贴该命令（因为项目需要，我们加上一些参数，可按需选择，所有 schematics 参数均支持），我们来快速创建和官

关注