Angular многократная фильтрация, наблюдаемая, rxJS - PullRequest
Новая
       77

Angular многократная фильтрация, наблюдаемая, rxJS

0 голосов
/ 29 апреля 2020

Здравствуйте, я хочу использовать 3x фильтр ввода (1x input:text, 2x select). У меня есть список наблюдаемых userList$: Observable<User[]>. В ngOnInit() я фильтрую этот список, используя мой input:text. 

userList$: Observable<User[]>
inputControl = new FormControl();  // input type text
selectStatus = new FormControl();  // select
filteredData$:any;

ngOnInit(){
   this.filteredData$ = combineLatest(
      this.userList$,
      this.inputControl.valueChanges.pipe(
        startWith(""),
        debounceTime(400)
      )
    ).pipe(
      distinctUntilChanged(),
      filter(([list, input]) => Boolean(list)),
      map(([list, input]) => {
        return list.filter(
          ({login}) => !input || login.toLowerCase().indexOf(input) !== -1);
      })
    );  
    this.userList$ = this.filteredData$;
}

Когда я добавляю еще один фильтр, первый фильтр не работает .. Код, когда я использую 2х фильтрованный: 

ngOnInit(){
    this.filteredData$ = combineLatest(
      this.userList$,
      this.inputControl.valueChanges.pipe(
        startWith(""),
        debounceTime(400)
      )
    ).pipe(
      distinctUntilChanged(),
      filter(([list, input]) => Boolean(list)),
      map(([list, input]) => {
        return list.filter(
          ({login}) => !input || login.toLowerCase().indexOf(input) !== -1);
      })
    );  
    this.filteredData$ = combineLatest(
      this.userList$,
      this.selectStatus.valueChanges.pipe(
        startWith(""),
        debounceTime(400)
      )
    ).pipe(
      distinctUntilChanged(),
      filter(([list, input]) => Boolean(list)),
      map(([list, input]) => {
        if(input == 1){
          return list.filter(
            ({is_banned, is_deleted}) =>  is_banned !== 1 || is_deleted !== 1);
        }else if (input == 2){
          return list.filter(({is_banned}) => is_banned == 1 );
        }else{
          return list.filter(({is_deleted}) => is_deleted == 1 );
        }
      })
    );
    this.userList$ = this.filteredData$;
 }

Как я могу отфильтровать этот список при использовании 3x поля фильтра?

...