맞춤 필터 : 필터 용 맞춤 버튼을 사용할 수 있습니까?

Question

내 맞춤 필터가 ag-gridangular에 있습니다.
Apply 버튼 외에도 다른 버튼이 필터에 있어야합니다. 즉, 어떤 종류의 UI에서 이것을 설명 할 수 있다면

| - 사용자 정의 필터 -------------------.
| 필터 텍스트 : _____________ |
| Apply | Clear | Clear All |
| _______________________ |

ag-grid의 기본 필터 구성 요소를 사용하면 filterParams을 ColDef에 입력하면 필요한 두 개의 버튼을 사용할 수 있다는 것을 알고 있습니다.

filterParams: { 
    applyButton: true, 
    clearButton: true 
} 

그러나 다른 사용자 (Clear All) 버튼에 대한 ? 내가 이룰 수있는 방법이 있습니까?

Answer 1

검색 및 시행 착오 몇 시간 후에 그것을 달성했습니다. ag-Grid Angular Custom Filter Component 은 PartialMatchFilterComponent과 그 코드를 살펴 유무 :

는 예를 살펴 여기 주었다.

템플릿 및 구성 요소의 일부 코드를 업데이트 한 후이를 얻을 수 있습니다.

업데이트 템플릿 : 구성 요소 코드

<button (click)="apply()">Apply</button> 
<button (click)="clear()">Clear</button> 
<!-- any other buttons you want to keep --> 

리틀 업데이트 : 그냥 Apply 버튼 클릭에 this.params.filterChangedCallback()를 호출해야합니다.

apply(): void { 
    this.params.filterChangedCallback(); 
} 
clear(): void { 
    this.text = ''; 
    this.params.filterChangedCallback(); 
} 
onChange(newValue): void { 
    if (this.text !== newValue) { 
     this.text = newValue; 
     // this.params.filterChangedCallback(); - remove 
    } 
}