【问题标题】:ngx-DataTable sort on a column not working Angular 4ngx-DataTable 对列不工作的列进行排序 Angular 4
【发布时间】:2018-09-28 13:10:43
【问题描述】:

虽然我对 Angular 非常陌生,但我在使用 ngx-DataTable 时遇到了一些困难。我正在使用简单的 ngx-DataTable 进行简单的操作。问题出在列上,尽管我已将 attr 声明为 [sortable]=true,但排序不起作用。这是代码。 表定义:

 <ngx-datatable
                [columns]="columns"
                [columnMode]="'force'"
                [headerHeight]="40"
                [footerHeight]="50"
                [rowHeight]="'auto'"
                [limit]="10"
                [rows]='contacts'>

DataTable包含两列,定义如下。

    <ngx-datatable-column
                        [width]="50"
                        [resizeable]="true"
                        [sortable]="true"
                        [draggable]="true"
                        [canAutoResize]="true" name="Name">
       <ng-template let-row="row" ngx-datatable-cell-template>
          <span>{{row.first_name}}</span>
       </ng-template>
   </ngx-datatable-column>

    <ngx-datatable-column
                        [width]="50"
                        [resizeable]="true"
                        [sortable]="true"
                        [draggable]="true"
                        [canAutoResize]="true" name="Actions">
        <ng-template let-row="row" let-rowIndex="rowIndex" ngx-datatable-cell-template>
      <!--Template Here-->
        </ng-template>
   </ngx-datatable-column>

我只想让我的姓名列可排序。请帮帮我。提前致谢。

【问题讨论】:

  • 它呈现正确的表格?
  • 你可以创建你的排序函数
  • 正确渲染。 @MihaiAlexandru-Ionut。我也有一些其他页面,它正在完全工作。但不在此。我不知道为什么..

标签: javascript angular ngx-datatable


【解决方案1】:

好吧,它解决了。实际上它找不到可以进行列排序的值。所以我只是在ngx-datatable-column 声明中写了prop='first_name',让它知道要排序的内容,就像这样。

<ngx-datatable-column
    [width]="50"
    [resizeable]="true"
    [sortable]="true"
    [draggable]="true"
    [canAutoResize]="true" name="Name" prop="first_name">
</ngx-datatable-column>

【讨论】:

  • 这对我不起作用。还有为什么 prop 的值是单引号而不是像其他所有东西一样的双引号?!
  • 好吧,引用在这方面并不重要。如果您共享代码,我可以检查问题。 @emirhosseini
  • 解释是,默认情况下,prop 值将是 name 的驼峰式版本(请参阅文档 swimlane.gitbook.io/ngx-datatable/api/column/inputs#prop-string),但您使用的是蛇形名称。
  • 我们可以为特定列本身创建自定义排序吗?
  • @VishnuSBabu 是的,我们可以在列本身上创建自定义排序。我们将不得不使用带有 ngx-datatable-column 的比较器属性。
猜你喜欢
  • 1970-01-01
  • 2018-04-01
  • 2023-04-06
  • 1970-01-01
  • 1970-01-01
  • 2017-12-25
  • 1970-01-01
  • 2020-04-17
  • 1970-01-01
相关资源
最近更新 更多