angularangular-reactive-formsstate-managementngxsangular-state-managmement

Searching Data From Different Component in Angular NGXS

I'm trying to figure out how will i able to search in NGXS from different component. I have my searchbar from the navbar component while i'm displaying my data from app component which is a different component. Please see this stackblitz link CLICK HERE

CODE

this.peopleForm.get('name').valueChanges.pipe(debounceTime(500)).subscribe(
  (name: string) => {
    console.log(name);
    this.people$ = this.store.select(AppState.nameFilter(name));
  }
)
Solution

  • Having a look at your StackBlitz, it seems you are trying to filter a list based on what is entered in the peopleForm input element.

    Rather than tryring to select from the store when this value changes in the component, I've found a good way to model this problem is to store the 'search text' in the state, and use a @Selector that applies the current search value to the list returns those items that meet the criteria.

    Take a look at this answer where I've outlined this approach.