Select 通过向 NGXS 中的状态传递参数来获取值

Question

我有一个包含 JSON 的状态，如下所示：

{id: "1", name: "ig1", description: "ig 11"}
{id: "5", name: "hhh", description: "hhh"}
{id: "6", name: "ggg", description: "hhh"}

我需要 select 状态数组中 id = 1 的数据

如何使用 NGXS 状态 select 或

完成此操作

我们如何在组件中访问它？

我有以下状态的内容

食谱

0 : {id: "3", name: "Cake", image: "index.jpg", description: "Lorem Ipsum is 
simply dummy text of the printing a…ldus PageMaker including versions of 
Lorem Ipsum.", ingredients: "ig 1-1kg,ig 123-4kg"}
1 : {id: "16", name: "gfdg", image: "Chrysanthemum.jpg", description: 
"fhfgh", 
ingredients: "gdfg-4sfhs,ig 1-1kg"}
2 : {id: "17", name: "hfgh", image: "Jellyfish.jpg", description: "ghgfh", 
ingredients: "ig 123-5kg,ig 1-3kg"}
3 :{id: "18", name: "hgj", image: "Koala.jpg", description: "ghjhgj", 
 ingredients: "gdfg-5sfhs"}

我想获取索引 1 的状态数据，即 {id: "16", name: "gfdg", image: "Chrysanthemum.jpg", description: "fhfgh", ingredients: "gdfg-4sfhs,ig 1-1kg"}

根据您的回复我添加了以下代码

在组件中：

import { RecipeState } from '../../state/recipe.state';
edit_details :  Observable<string[]>;

editRecipepopup( id ) {
this.edit_details = this.store.select(RecipeState.findById).pipe(map(filterFn 
=> filterFn(id)));
console.log("edit=>",this.edit_details);
}

状态：

@Selector()
static findById(state: string[]) {
return (id: string) => { //<--- Return a function from select
    console.log("id=>"+id);
   return state.filter(s => s.indexOf(id) > -1);
};
}

但是我没有得到数据。我的 id 也没有登录控制台

Answer 1

给你，这是查询你的状态的方法：

在您的状态文件中：

@Selector() 
static getIndexed(state: any[]) {
    return (index: number) => { //<--- Return a function from select
        return state[index];
    };
}

来自您的组件：

this.store.select(YourState.getIndexed).pipe(map(filterFn => filterFn(YOUR_INDEX)));

WORKING DEMO ( And For More Detail : Do Read)

Select 通过向 NGXS 中的状态传递参数来获取值

Select value from state in NGXS by passing it a parameter

ngrx

angular

ngxs