primeng rowStyleClass无法按预期工作

时间:2016-12-15 15:41:35

标签: angular datatable primeng

我在angular 2应用程序中有一个primeng datatable(1.1.0),我使用rowStyleClass将类设置为一个扩展的行。

问题是,当行被占用时,它工作正常,但是如果我将其折叠,那么它仍然是扩展类。

组件

  rowStyle(rowData: any, rowIndex: number): string {
    if ((this as DataTable).isRowExpanded(rowData)) {
      return 'ui-state-highlight';
    } else {
      return '';
    }
  }

查看

<p-dataTable tableStyleClass="table" *ngIf="model.result.length > 0" [rows]="itemsPerPage" [paginator]="isPaginatorVisible()"
      (onSort)="resetPagination()" [value]="xModel.ergebnis" [(selection)]="selected" expandableRows="true" [rowStyleClass]="rowStyle">
...

如果展开的话:

<tr class="ui-datatable-even ui-datatable-odd ui-state-highlight ui-widget-content" ng-reflect-klass="ui-widget-content ui-state-highlight" ng-reflect-ng-class="[object Object]">

然后崩溃了:

<tr class="ui-datatable-even ui-datatable-odd ui-widget-content ui-state-highlight" ng-reflect-klass="ui-widget-content" ng-reflect-ng-class="[object Object]">

正如您所看到的,ui-state-highlight仅从ng-reflect-klass中删除,而不是从类本身中删除。这是一个错误还是我做错了什么?

1 个答案:

答案 0 :(得分:0)

尝试手动检测更改并在更改后更新视图 - 使用Angular的ChnageDetector:

import {ChangeDetectorRef} from '@angular/core';

constructor(private changeDetectorRef: ChangeDetectorRef) {}

  rowStyle(rowData: any, rowIndex: number): string {
    if ((this as DataTable).isRowExpanded(rowData)) {
      return 'ui-state-highlight';
    } else {
      return '';
    }
    if (!this.changeDetectorRef['destroyed']) {
          this.changeDetectorRef.detectChanges();
    }
  }