Kendo 网格 Angular - 基于 orderIdex 的列自定义顺序
Kendo Grid Angular - Columns Custom order of based on orderIdex
我有一个模型，其中包含字段、标题和订单索引。我想根据 kendo 网格中的顺序索引（而不是数组的顺序）加载列。动态添加数据和字段。
字段：
[{field:"ProductName", Title: "Product Name", orderIndex: 0}, {field:"Amount", Title: "Amount", orderIndex: 1}]
数据：
[{ "ProductName":"Laptop-1", "Amount": 1000 }, { "ProductName":"Laptop-2", "Amount": 1500 }]
使用 和 (columnReorder)=" columnReorder($event)"
我尝试了 columnReorder 事件，但没有按预期工作。有什么方法可以根据 orderIdex 显示列吗？
由于您是通过 ngFor 生成的，所以元素的创建顺序与数组中的项目顺序相同。
为了显示基于 orderIndex 的列，您需要对数组本身进行排序。 (Example StackBlitz)
基本上你必须做这样的事情：
this.columns = fields.sort((a, b) => a.orderIndex - b.orderIndex);
我有一个模型，其中包含字段、标题和订单索引。我想根据 kendo 网格中的顺序索引（而不是数组的顺序）加载列。动态添加数据和字段。
字段： [{field:"ProductName", Title: "Product Name", orderIndex: 0}, {field:"Amount", Title: "Amount", orderIndex: 1}]
数据： [{ "ProductName":"Laptop-1", "Amount": 1000 }, { "ProductName":"Laptop-2", "Amount": 1500 }]
使用
我尝试了 columnReorder 事件，但没有按预期工作。有什么方法可以根据 orderIdex 显示列吗？
由于您是通过 ngFor 生成的，所以元素的创建顺序与数组中的项目顺序相同。
为了显示基于 orderIndex 的列，您需要对数组本身进行排序。 (Example StackBlitz)
基本上你必须做这样的事情：
this.columns = fields.sort((a, b) => a.orderIndex - b.orderIndex);