Angular 通过传递参数从NGXS中的状态选择值

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

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

我需要从状态数组中选择id=1的数据

如何使用NGXS状态选择器实现这一点

我们如何在组件中访问它

---

我有以下内容在国家

食谱

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”，名称：“gfdg”，图像：“jummery.jpg”，描述：“fhfgh”，成分：“gdfg-4sfhs，ig1-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);
}

从“../../state/recipe.state”导入{RecipeState}；
编辑_详细信息：可观察；
EditRecipePup（id）{
this.edit_details=this.store.select（RecipeState.findById）.pipe（map（filterFn
=>filterFn（id））；
log（“edit=>”，this.edit\u详细信息）；
}

在该州：

@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);
};
}

@Selector（）
静态findById（状态：字符串[]）{
return（id:string）=>{//s.indexOf（id）>-1）；
};
}

---

但我没有得到数据。此外，我的id未登录控制台

在这里，您可以通过以下方式查询您的状态：

在您的州文件中：

@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))); 

---

---

（有关详细信息：）

现在，您可以通过以下方式查询您的状态：

在您的州文件中：

@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))); 

---

---

（更多详情请参见：）

@谁会给出负面报价。你能说说原因吗。如果你给出否定的答案，那么就给出答案。我不是投反对票的人之一，但我猜这是因为你没有包含任何代码来展示你自己是如何试图解决问题的——最好的问题展示了你已经尝试了什么，如果你自己无法解决问题，请寻求帮助。这可能会导致一个与您尝试的完全不同的解决方案，也可能是对您发布的内容的一个简单调整，但即使没有这个，大多数人也不会费心回答。@谁会给出否定的引用。你能说说原因吗。如果你给出否定的答案，那么就给出答案。我不是投反对票的人之一，但我猜这是因为你没有包含任何代码来展示你自己是如何试图解决问题的——最好的问题展示了你已经尝试了什么，如果你自己无法解决问题，请寻求帮助。这可能会导致一个与您所尝试的完全不同的解决方案，也可能是对您发布的内容的简单调整，但如果没有这些，大多数人都不会费心回答。editRecipePup（id）{this.editdisplay='block'；this.editclass='show'；this.editdetails=this.store.select（RecipeState.getIndexed）.pipe（map（filterFn=>filterFn（id））；console.log（“details=>”，this.editdetails）；}在控制台中我得到：details=>t{u isScalar:false，source:t，operator:t}它将始终返回可观察的，请检查更新的答案，最后一部分code@Abhijit，我还附上了演示，请看一看，我想这消除了你所有的疑虑。@Abhijit，你试过这个吗？如果答案对你有帮助，请向上投票或接受。EditRecipePup（id）{this.editdisplay='block'；this.editclass='show'；this.editdetails=this.store.select（RecipeState.getIndexed）.pipe（map（filterFn=>filterFn（id））；console.log（“details=>”，this.editdetails）；}在控制台中，我得到：details=>t{isScalar:false，source:t，operator:t}它将始终返回可观察的，请检查更新的答案，最后一部分code@Abhijit，我也附上了演示，请看一看，我想这消除了你所有的疑虑。@Abhijit，你试过这个吗？如果对你有帮助，请投票或接受答案。