在Angular NGXS中从不同组件搜索数据 [英] Searching Data From Different Component in Angular NGXS
问题描述
我试图弄清楚如何从不同组件中搜索NGXS.当我显示来自不同组件的应用程序组件的数据时,我从导航栏组件获取了搜索栏. 请查看此stackblitz链接 点击此处
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
CODE
this.peopleForm.get('name').valueChanges.pipe(debounceTime(500)).subscribe(
(name: string) => {
console.log(name);
this.people$ = this.store.select(AppState.nameFilter(name));
}
)
推荐答案
看看您的StackBlitz,您似乎正在尝试根据在peopleForm
输入元素中输入的内容过滤列表.
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.
我发现在组件中更改此值时,不是尝试从存储中进行选择,而是找到了对这个问题进行建模的一种好方法,那就是将搜索文本"存储在状态中,并使用一个适用的@Selector
列表中的当前搜索值将返回那些符合条件的项目.
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.
这篇关于在Angular NGXS中从不同组件搜索数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!