在 ngx-datatable 中的特定列上禁用 select

Question

我有一个 ngx-datatable，它有 4 个数据列和一个带有删除按钮的列，用于从 table 中删除行，如下所示。

HTML代码

<ngx-datatable
*ngIf="!isLoading"
#table
class="data-table"
[scrollbarH]="true"
[rows]="data"
[columnMode]="'force'"
[headerHeight]="50"
[footerHeight]="50"
[rowHeight]="'auto'"
[limit]="limit"
[selected]="selected"
[selectionType]="'single'"
(select)='onSelect($event)'>

    <ngx-datatable-column *ngFor="let columnData of columns" name={{columnData.name}} prop={{columnData.prop}}>
       <ng-template let-column="column" let-sort="sortFn" ngx-datatable-header-template>
          <span class="datatable-header-column datatable-header-cell-label" (click)="sort()"><i class="{{columnData.icon}}" ></i> {{columnData.name}}</span>
       </ng-template>
    </ngx-datatable-column>

    <ngx-datatable-column [sortable]="false" [maxWidth]="70">
        <ng-template let-column="column"  let-row="row" ngx-datatable-cell-template>
            <button class="btn btn-danger btn-mini" *ngIf='!row.unAssigning' (click)="onDelete(row, column)">
                <i class="icofont icofont-trash"></i>
            </button>
            <img class="mini-spinner" *ngIf="row.unAssigning" src="../assets/img/busy-red.gif">
        </ng-template>
    </ngx-datatable-column>     

</ngx-datatable>

TS文件

onSelect({
    selected
}) {
    this.router.navigate(['/update', selected[0].id]);
}

当前当 select 一行，将用户重定向到另一个页面。但是我需要在单击 table 中的删除按钮时删除重定向功能。重定向必须仅在单击数据列时执行。

我怎样才能做到这一点？

Answer 1

如果我理解你的问题，你想按下删除按钮而不使用 onSelect 功能重定向用户。

您可以试试下面的代码：

<button class="btn btn-danger btn-mini" *ngIf='!row.unAssigning' (click)="$event.preventDefault(); $event.stopPropagation(); onDelete(row, column)">
    <i class="icofont icofont-trash"></i>
</button>

在 ngx-datatable 中的特定列上禁用 select

Disable select on specific column in ngx-datatable

typescript2.0

ngx-datatable

angular