How can I receive returned values through a custom filter?

[dxforceiwei]

How can I receive returned values through a custom filter and then call the Search function? I've tried for a long time without success.

settings: any = {
  actions: {
    add: false,
    edit: false,
    delete: false,
  },
  pager: {
    display: true,
    perPage: 50,
  },
  columns: {
    image: {
      title: '編輯',
      filter: false,
      type: 'html',
      width: '5%',
      valuePrepareFunction: (cell, row) => {
        return `<div class="ng-star-inserted-center">
                  <a href="${this.router.url}/Modify/${row.SerialNumber}">
                    <img width="32px" src="./assets/images/edit.svg"/>
                  </a>
                </div>`;
      }
    },
    Factory: {
      title: '廠區',
      type: 'html',
      width: '15%',
      filter: {
        type: 'custom',
        component: CustomSelectFilterComponent,
        config: {
          options: [],
          response: (selectedValues: string[]) => {
            console.log('selectedValues', selectedValues);
            this.selectedFactory = selectedValues;
            this.onSearch();
          }
        }
      },
      filterFunction(cell?: any, search?: string): boolean {
        console.log('cell', cell);
        console.log('search', search);
        return this.doFilter(cell, search);
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
    EmployeeNumber: {
      title: '工號',
      type: 'html',
      width: '5%',
      filter: {
        type: 'text',
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
    Name: {
      title: '使用者名稱',
      type: 'html',
      width: '5%',
      filter: {
        type: 'text',
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
    Username: {
      title: '帳號',
      type: 'html',
      width: '5%',
      filter: {
        type: 'text',
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
    Permission: {
      title: '權限',
      type: 'html',
      width: '5%',
      filter: {
        type: 'custom',
        component: CustomSelectFilterComponent,
        config: {
          options: [],
          response: (selectedValues: string[]) => {
            this.selectedPermission = selectedValues;
            this.onSearch();
          }
        }
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
    Group: {
      title: '單位',
      type: 'html',
      width: '5%',
      filter: {
        type: 'custom',
        component: CustomSelectFilterComponent,
        config: {
          options: [],
          response: (selectedValues: string[]) => {
            this.selectedGroup = selectedValues;
            this.onSearch();
          }
        }
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
    MailAddress: {
      title: '信箱',
      type: 'html',
      width: '5%',
      filter: {
        type: 'text',
      },
      valuePrepareFunction: (data) => {
        return `<div class="ng-star-inserted-center">${data}</div>`;
      }
    },
  },
};

onSearch() {
    const query = {
      Factory: this.selectedFactory.length ? this.selectedFactory : null,
      Permission: this.selectedPermission.length ? this.selectedPermission : null,
      Group: this.selectedGroup.length ? this.selectedGroup : null,
    };
    this.service.Index({
      Factory: query.Factory ? query.Factory.join(',') : Cookie.get('Factory'),
      User: this.Base64Service.decodeValue(Cookie.get('Name')),
      Permission: query.Permission ? query.Permission.join(',') : Cookie.get('Permission'),
      Group: query.Group ? query.Group.join(',') : Cookie.get('Group'),
      Auth_Person: this.Auth_Person,
      Active: "0"
    }).subscribe({
      next: (data: PersonIndex[]) => {
        this.source.load(data);
      },
      error: (error) => {
        console.error('Error loading data', error.message);
      }
    });
  }
![image](https://github.com/akveo/ng2-smart-table/assets/22144915/b6b79d58-a7f3-4350-a270-740602503e6f)