검색 기능 사용자 정의

Dec 26 2020

열이있는 테이블을 보여줍니다. 내가 필요한 것은 기본 필터 기능 대신 검색 조회 기능을 구축하는 것이므로 전체 테이블이 아닌 미니 필터 창에있는 값 목록 ON : [! [여기에 이미지 설명 입력] [1]] [1]

전체 이름 Michael을 입력하면 테이블이 Michael에 의해 필터링되거나 전화 번호를 입력하면 Michael의 이름이 Michael에 의해 필터링됩니다. 다시 말해.

필터 기반 토큰을 필터링하기 위해 필터 값을 변경하고 열 값을 열 기반 토큰으로 변경하고 싶지는 않지만 검색 필드의 사용자 입력이 토큰 내부에있는 경우에만 필요합니다. 토큰의 키를 반환하고 사용자에게 보여줍니다.

답변

1 rateLess Dec 28 2020 at 18:31

여기에 작동 예가 있습니다 . Angular에 익숙하지 않으므로 코드가 이상하게 보일 수 있습니다.

에 정의 된대로 CustomSetFilter텍스트 입력 tokens이 각 확인란 의 검색 필드 역할을하는 라는 사용자 지정 필터 를 정의했습니다 filterData. 입력이 비어 있으면 모든 확인란이 나타납니다. 그렇지 않은 경우 입력 값 (대소 문자 무시)과 동일한 토큰이있는 확인란 만 표시됩니다. 이것은 onChange()함수 에서 볼 수 있습니다 .