ng2-smart-table 行索引答案

【问题标题】：ng2-smart-table row indexng2-smart-table 行索引
【发布时间】：2019-01-08 16:43:36
【问题描述】：

我在我的 Angular 项目中使用 ng2-smart-table，它按预期工作。我只想知道如何在每一行中显示行号。从 google 上的文档和示例中，我能想到的只是在数据 itslef 中设置一个属性，这不是一个好主意。如果有任何方法或解决方法，请提出建议。这是我的数据设置和我的 ng2-smart-table 的样本数据

settings2 = {
    columns: {
      id: {
        title: 'ID',
        filter: true,
      },
      name: {
        title: 'Fact',
        filter: true,
      },
      description: {
        title: 'Description',
        filter: true,
      },
    },
    actions: {
      add: false,
      edit: false,
      delete: false,
      custom: [
        {
          name: 'view',
          title: `<i class="ti-eye text-success m-r-10" data-target="#view"></i>`,
        },
        {
          name: 'edit',
          title: `<i class="ti-pencil text-info m-r-10" data-target="#update"></i>`,
        },
        {
          name: 'delete',
          title: `<i class="ti-trash text-danger m-r-10"></i>`
        },
      ]
    }
  }

数据 -

[{
"id":  "770e6370-cf14-4a0a-b9db-0a6e99b5783b" ,
"list": [
{
"description":  "Coopentity" ,
"type":  "CO_OP"
} ,
{
"description":  "" ,
"type":  "FARM"
} ,
{
"description":  "" ,
"type":  "FACTORY"
} ,
{
"description":  "" ,
"type":  "AUDITING_FIRM"
}
] ,
"name":  "entity_types"
}]

HTML -

 <ng2-smart-table [settings]="settings2" [source]="facts" (custom)="onCustom($event)" class=""></ng2-smart-table>

【问题讨论】：

问题现在开放了吗？

标签： angular ng2-smart-table

【解决方案1】：

在智能表的设置中

index:{
  title: 'sr_no',
  type: 'text',
  valuePrepareFunction: (value,row,cell) => {
    return cell.row.index;
   }
}

【讨论】：

接下来呢？如何在组件代码中取这个值？

【解决方案2】：

如果假设您在 component.ts 正文中的数据源是：

source: LocalDataSource;

在您的列定义中：

valuePrepareFunction : (val,row,cell)=>{
   const pager = this.source.getPaging();
   const ret = (pager.page-1) * pager.perPage + cell.row.index+1;

   return ret;
}

【讨论】：

【解决方案3】：

如果您想在打字稿中获取索引，也许这可以帮助您：

在html中

<ng2-smart-table #table [settings]="settings" [source]="source"></ng2-smart-table>

在打字稿中

@ViewChild('table', { static: false }) table;
getIndex(columnName: string) {
let index = 0;
  for (const column in this.table.columns) {
    if (column === columName) {
      console.log(index);
    }
  index++;
  }
}

希望这是您正在搜索的内容。

【讨论】：