SuperAPI AI 工具集

build-table

前端与建站

查看项目

更新于 10-16 03:36

技能介绍

用途:按需求生成基于 @fundamental-ngx/platform 的 Angular 数据表格组件,默认使用 fdp-table,并提供排序、筛选、分页与行选择等能力。

主要能力:可根据参数确定表名、数据模型、基础组件(fdp-table 或 fd-table)与所需功能(sort、filter、paginate、select、toolbar),并选择静态数组、Observable 或 HTTP 懒加载数据源。生成前会输出表格方案(列定义、DataSource 类型、功能勾选、工具栏动作),等待确认后再生成代码。

使用方式:若参数为空,需先询问显示的数据与所需功能;通过 @fundamental-ngx/mcp MCP 服务器调用 get_usage_guide('table')、get_component_api('fdp-table') 等获取上下文,MCP 不可用时读取 libs/mcp-server/src/data/usage-guides.ts。随后生成 TypeScript、HTML、SCSS 三个文件,并按 NX 或 Angular CLI 构建命令验证。

关键限制:TableInitialStateDirective 必须导入,否则表格显示无可见列;PlatformTableModule 已废弃,应逐个导入组件;FdpTableDataSource 只是类型别名,静态数组用 ArrayTableDataSource,Observable 用 ObservableTableDataSource;TableRowSelectionChangeEvent 来自 table-helpers;不存在 fdpTableSortable/fdpTableFilterable 指令,排序筛选仅靠 fdp-column 上的 [sortable] 与 [filterable];[pageSizeOptions] 不存在,只有 [pageSize];fdp-table-view-settings-dialog 必需;fdp-column 的 name 与 key 均必填;不要直接传 BehaviorSubject,应使用 new ObservableTableDataSource(subject.asObservable());selectionMode 为字符串 'single'|'multiple'|'none';引入 platform 后初始包约 4.6 MB,需在 angular.json 提高预算;自定义单元格用 fdpTableCell;不要添加 standalone: true;模板用 @if/@for 而非 *ngIf/*ngFor。