angular - PrimeNg GlobalFilter : 最初の列で一致を見つけた後に検索を停止します (後続の列で値を検索しません)

Question

初期 UI (フィルターなし):

[globalFilterFields]="['name','marketingName','m_id']"

問題 : 最初の列で一致が見つかった後、他の列フィールドがスキップされる

ここでは、1 列目と 2 列目にある「モデル」を検索しています。ただし、2列目は考慮していません。

期待: 最初の 3 行は、Database、Dataset1、Model である必要があります。

スタックブリッツ: https://stackblitz.com/edit/primeng-treetablefilter-demo-efg4b5?file=src/assets/filesystem.json

モジュールを展開してから、グローバル検索で「モデル」を使用して検索してください。

以下に示すように、グローバル フィルターを使用して p-treeTable の行をフィルター処理するための検索ボックスがあります。

<input #searchBox type="text" [(ngModel)]="searchText" pInputText class="searchBox"
          placeholder="Search"
          (input)="tt.filterGlobal($event.target.value, 'contains')" />

TreeTable にマップされた列定義は次のようになります。

this.columns = [
      { field: "name", header: "Name", width: '38%' },
      { field: "marketingName", header: "marketingName", width: '19%' },
      { field: "m_id", header: "M ID", width: '16%' },
      { field: "operation", header: "Operation", width: '7%' }
    ];

ツリーテーブル コード:

<p-treeTable #tt [value]="businessUnit" [columns]="columns" selectionMode="single"
          [(selection)]="selectedTreeProgram" dataKey="name" (onNodeSelect)="onNodeSelect(true)"
          (onNodeUnselect)="onNodeSelect(false)" [globalFilterFields]="['name','marketingName','m_id']">
          <ng-template pTemplate="colgroup" let-columns>
            <colgroup>
              <col *ngFor="let col of columns" [style.width]="col.width">
            </colgroup>
          </ng-template>
          <ng-template pTemplate="header" let-columns>
            <tr>
              <th *ngFor="let col of columns" style="display: none">
                {{col.header}}
              </th>
            </tr>
          </ng-template>
          <ng-template pTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
            <tr class="bu-row" [id]="utils.getId(rowData['name'])">
              <td *ngIf="!rowData['m_id']"> 
                  <div class="combine name">{{rowData['name']}}</div>
              </td>
              <td>
                //Dummy
              </td>
              <td>
                //Dummy
              </td>
              <td>
                //Dummy
              </td>
            </tr>
            <tr *ngIf="rowData['m_id']" [ttRow]="rowNode" [ttSelectableRow]="rowNode" class="tree-child-row">
              <td>
                   //Icons
                  <div class="combine name">{{rowData['name']}}</div>
              </td>
              <td>
                <div class="combine">{{rowData['marketingName']}}</div>
              </td>
              <td>
                <div class="combine">{{rowData['m_id']}}</div>
              </td>
              <td>
                    //Edit Delete Icon
              </td>
            </tr>
          </ng-template>
        </p-treeTable>