Question

我是一名实习生，需要一些帮助。

我有一个ngx-datatable，我想在满足条件时显示行。我该怎么做？例如，如果覆盖的国家是美国，则显示，如果没有，则显示。

<ngx-datatable class="table-zenmoov" [columnMode]="'force'" [rows]="rows" [rowHeight]="'auto'"
      [headerHeight]="'auto'" [footerHeight]="'auto'" [externalPaging]="true" [count]="paginationInfo.totalElements"
      [loadingIndicator]="loadingIndicator"
      [offset]="paginationInfo.currentPage" [limit]="paginationInfo.pageSize" (page)="setTablePage($event)"
      (sort)="onSort($event)">

      <ngx-datatable-column name="Name" [prop]="'first_name'" [sortable]="true">
        <ng-template let-row="row" ngx-datatable-cell-template>
          <div class="user-wrap">
            <div class="zenmoov-vendor" [style.background]="row.company_id?'#f0ad4e':'#5bc0de'"></div>
            <div class="img-circle img-wrapper vendor-avatar">
              <img *ngIf="row.avatar_url" [src]="row?.avatar_url " alt="logo">
            </div>
            <ng-container *ngIf="auth.userRID=='admin'">
              <a [routerLink]="['../../vendor/',row._id]">{{ row?.first_name }} {{ row?.last_name }}</a>
            </ng-container>
            <ng-container *ngIf="auth.userRID=='hr'">
              <a [routerLink]="['../../../vendor/',row._id]">{{ row?.first_name }} {{ row?.last_name }}</a>
            </ng-container>
            <ng-container *ngIf="auth.userRID=='talent'">
              <a [routerLink]="['/talent/vendor/',row._id]">{{ row?.first_name }} {{ row?.last_name }}</a>
            </ng-container>
          </div>
        </ng-template>
      </ngx-datatable-column>

      <ngx-datatable-column name="Company" [sortable]="false">
        <ng-template let-row="row" ngx-datatable-cell-template>
          {{ row?.company_name }}
        </ng-template>
      </ngx-datatable-column>
</ngx-datable class>

Answer 1

您可以在*ngIf元素上使用html，只有在满足条件的情况下，它才会显示。

Answer 2

不过，我从不使用ngx-datatable，从快速浏览文档和您的代码的角度来看，我认为我理解了。我想这[rows]="rows"位是您将数据馈送到数据表的位置，您需要做的是过滤掉不想包含在数据表中的对象，例如在TypeScript文件中： / p>

TypeScript文件

// Array of strings that contains all countries in America
const americaCountries = [...];
// Iterate over each row and verify if the country of that row is in the array americaCountries
// If it is, that row is added to a new array named americaRows
this.americaRows = this.rows.filter(row => americaCountries.includes(row.country));

HTML文件

[rows]="americaRows"

请记住，这是伪代码，因为我不知道您的TypeScript代码和行对象结构。

仅在满足某些条件时显示行

2 个答案: