2

我p-table在最后一列中有一个带有 3 个按钮的 PrimeNG，这些按钮中的每一个都调用一个特定的方法，我通过rowdata将相同的数据从 HTML 传递给组件方法，但由于某些原因，在组件中我没有相同的数据：在一种情况下，我有与下一行相关的数据。

如果我单击组件中的第一个按钮 (dupModel(rowData))，我将获得下一行的rowData（错误地）。它只发生在这种情况下，我的p-table项目中有很多。

例如，如果我单击第一行中的第一个按钮，我会转到第二个元素的详细信息，如果我单击第一行中的第二个按钮，我会（正确地）转到第一个元素的详细信息。

<p-table #dt [value]="ticketBundleList" [rows]="event.rows" [paginator]="true" [rowsPerPageOptions]="config.getConfig('primeng').table.page.options" [loading]="loader" [(first)]="event.first" [sortField]="event.sortField" [lazy]="true" [sortOrder]="event.sortOrder" [totalRecords]="totalElements" (onLazyLoad)="loadModelData($event)">
    <ng-template pTemplate="header" let-columns>
        <tr>
            <th [pSortableColumn]="'createdDate'">{{'ticketbundle.table.headers.createddate' | translate }}
            <p-sortIcon [field]="'createdDate'"></p-sortIcon>
            </th>

            <th [pSortableColumn]="'validFrom'">{{'ticketbundle.table.headers.validfrom' | translate }}
                                        <p-sortIcon [field]="'validFrom'"></p-sortIcon>
            </th>

            <th [pSortableColumn]="'validUntil'">{{'ticketbundle.table.headers.validuntil' | translate }}
                                        <p-sortIcon [field]="'validUntil'"></p-sortIcon>
            </th>

            <th [pSortableColumn]="'customer.name'">{{'ticketbundle.table.headers.customername' | translate }}
                <p-sortIcon [field]="'customer.name'"></p-sortIcon>
            </th>

            <th [pSortableColumn]="'code'">{{'ticketbundle.table.headers.code' | translate }}
                <p-sortIcon [field]="'code'"></p-sortIcon>
            </th>

            <th [pSortableColumn]="'totalPrice'">{{'ticketbundle.table.headers.totalprice' | translate }}
                <p-sortIcon [field]="'totalPrice'"></p-sortIcon>
            </th>
            <th></th>
            </tr>
            </ng-template>

            <!-- Body tabella -->
            <ng-template pTemplate="body" let-rowData let-columns="columns">
                <tr>
                    <td>
                        <span class="ui-column-title">{{'ticketbundle.table.headers.createddate' | translate }}</span>
                            {{rowData.createdDate | dateWithTimezone : config.getConfig('server').timezone : ('moment.withhour&min' | translate )}}
                                </td>
                                                                  <td>
                                    <span class="ui-column-title">{{'ticketbundle.table.headers.validFrom' | translate }}</span>
                                        {{rowData.validFrom | dateWithTimezone : config.getConfig('server').timezone : ('moment.onlydate' | translate )}}
                                    </td>

                                    <td>
                                        <span class="ui-column-title">{{'ticketbundle.table.headers.validuntil' | translate }}</span>
                                        {{rowData.validUntil | dateWithTimezone : config.getConfig('server').timezone : ('moment.onlydate' | translate )}}
                                    </td>

                                    <td>
                                        <span class="ui-column-title">{{'ticketbundle.table.headers.customername' | translate }}</span>
                                        {{rowData.customer?.name}}
                                    </td>

                                    <td>
                                        <span class="ui-column-title">{{'ticketbundle.table.headers.code' | translate }}</span>
                                        {{rowData.code}}
                                    </td>

                                    <td>
                                        <span class="ui-column-title">{{'ticketbundle.table.headers.totalprice' | translate }}</span>
                                        {{rowData.totalPrice | currency:'EUR':'symbol'}}
                        </td>
                        <td>
                    <div class="text-right">
                    <span class="pointer info" (click)="dupModel(rowData)" matTooltip="{{'ticketbundle.table.tooltips.duplicate' | translate }}" *ngIf="loggedUserService.checkIfAllowed(['role.admin', Roles.ROLE_BACK_OFFICE])"
                                                [matTooltipPosition]="'left'" [matTooltipShowDelay]="config.getConfig('tooltip').long.delay" [matTooltipHideDelay]="config.getConfig('tooltip').hide.delay">
                    <i class="material-icons icon-table">content_copy</i>
                    </span>
                    <span class="pointer light-green" (click)="selectModel(rowData)" matTooltip="{{'ticketbundle.table.tooltips.view' | translate }}" *ngIf="loggedUserService.checkIfAllowed(['role.admin', Roles.ROLE_BACK_OFFICE])"
                                                [matTooltipPosition]="'left'" [matTooltipShowDelay]="config.getConfig('tooltip').long.delay" [matTooltipHideDelay]="config.getConfig('tooltip').hide.delay">
                        <i class="material-icons icon-table">dvr</i>
                    </span>
                    <span class="pointer red" (click)="delete(rowData._links.self.href)" matTooltip="{{'ticketbundle.table.tooltips.delete' | translate }}" *ngIf="loggedUserService.checkIfAllowed(['role.admin', Roles.ROLE_BACK_OFFICE])"
                                                [matTooltipPosition]="'left'" [matTooltipShowDelay]="config.getConfig('tooltip').long.delay" [matTooltipHideDelay]="config.getConfig('tooltip').hide.delay">
                        <i class="material-icons icon-table">close</i>
                    </span>
                </div>
            </td>
        </tr>
    </ng-template>
</p-table>

零件

  /**
   * Route to the detailed view for the selected model
   * @param model
   */
  selectModel(model: any) {
    super.routeToView(['/ticketBundles', this.endPointUrlService.getUserId(model._links.self.href, '/', 6)]);
  }

  dupModel(model: any) {

    super.routeToView(['/ticketBundles', this.endPointUrlService.getUserId(model._links.self.href, '/', 6), 'copy'],
      { skipLocationChange: true });
  }

角度版本：6.0.6

PrimeNG 版本：6.0.2

4

0 回答 0