在TrNgGrid中使用自定义筛选进行自定义排序

<!-- 在你的HTML文件中 -->
<table tr-ng-grid>
  <thead>
    <tr>
      <th tr-ng-grid-header-cell>姓名</th>
      <th tr-ng-grid-header-cell>年龄</th>
      <th tr-ng-grid-header-cell>城市</th>
    </tr>
    <tr>
      <th tr-ng-grid-header-cell>
        <input type="text" [(ngModel)]="nameFilter" (ngModelChange)="applyCustomFilter()" placeholder="筛选姓名">
      </th>
      <th tr-ng-grid-header-cell>
        <input type="text" [(ngModel)]="ageFilter" (ngModelChange)="applyCustomFilter()" placeholder="筛选年龄">
      </th>
      <th tr-ng-grid-header-cell>
        <input type="text" [(ngModel)]="cityFilter" (ngModelChange)="applyCustomFilter()" placeholder="筛选城市">
      </th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let item of data | trNgGridFilter:customFilter | trNgGridSort:customSort">
      <td>{{ item.name }}</td>
      <td>{{ item.age }}</td>
      <td>{{ item.city }}</td>
    </tr>
  </tbody>
</table>

// 在你的组件中
import { Component } from '@angular/core';

@Component({
  selector: 'app-your-component',
  templateUrl: './your-component.component.html',
  styleUrls: ['./your-component.component.css']
})
export class YourComponent {
  data = [
    { name: '张三', age: 25, city: '北京' },
    { name: '李四', age: 30, city: '上海' },
    { name: '王五', age: 28, city: '广州' }
  ];

  nameFilter: string;
  ageFilter: number;
  cityFilter: string;

  customFilter = (item: any) => {
    return (!this.nameFilter || item.name.toLowerCase().includes(this.nameFilter.toLowerCase())) &&
           (!this.ageFilter || item.age === this.ageFilter) &&
           (!this.cityFilter || item.city.toLowerCase().includes(this.cityFilter.toLowerCase()));
  };

  customSort = (a: any, b: any) => {
    // 自定义排序逻辑
    // 返回负数表示a在b之前，返回正数表示a在b之后，返回0表示a和b相等
    return a.age - b.age;
  };

  applyCustomFilter() {
    // 手动触发筛选
    // 可以在这里进行一些其他操作，如请求后端数据等
  }
}