开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

如何将道具添加到Ngrx中选择器内的选择器

将道具添加到Ngrx中选择器内的选择器是一个常见的需求，可以通过以下步骤实现：

首先，确保已经安装并配置了Ngrx库。可以使用npm或yarn安装相关依赖。
创建一个新的选择器文件，例如"props.selectors.ts"，并导入所需的依赖：

import { createSelector, createFeatureSelector } from '@ngrx/store';
import { AppState } from '../app.state'; // 假设你的应用状态是AppState

在选择器文件中，创建一个特性选择器（feature selector），用于选择包含道具的特性状态。假设你的特性状态是"props"，可以使用createFeatureSelector函数创建特性选择器：

export const selectPropsState = createFeatureSelector<AppState, PropsState>('props');

创建一个选择器（selector），用于从特性状态中选择道具。可以使用createSelector函数创建选择器：

export const selectProps = createSelector(
  selectPropsState,
  (state: PropsState) => state.props
);

在组件中使用选择器来获取道具。首先，导入所需的依赖：

import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs';
import { selectProps } from './props.selectors';

在组件类中，注入Store服务，并创建一个Observable来订阅选择器的结果：

props$: Observable<Props[]>;

constructor(private store: Store<AppState>) {
  this.props$ = this.store.pipe(select(selectProps));
}

现在，你可以在组件模板中使用props$ Observable来访问道具数据了：

<ul>
  <li *ngFor="let prop of props$ | async">{{ prop.name }}</li>
</ul>

这样，你就成功将道具添加到Ngrx中选择器内的选择器中了。

关于Ngrx的更多信息和使用方法，你可以参考腾讯云的相关产品和文档：

Ngrx官方文档：https://ngrx.io/
腾讯云云原生产品：https://cloud.tencent.com/product/cns

请注意，以上答案仅供参考，具体实现可能因应用需求和环境而有所不同。

相关搜索:如何测试使用道具的NgRx选择器？分派选择器NGRX中的操作组合MemoizedSelector和普通选择器的ngrx选择器解析器中的NGRX选择器在ngrx中使用选择器和道具的替代方案是什么？在ngOnChanges中更新ngrx选择器 NgRx-实体-循环中的选择器无法取消订阅我的ngrx选择器调用 Angular/NgRx -在守卫中组合2个选择器如何将ngRx的跟随选择器转换为布尔返回值？ngrx/效果如何将参数从选择器解析为GET 带有NgRx选择器的RxJS groupBy永远不会完成覆盖测试中的NGRX存储选择器似乎已被查询如何将变量添加到伪类的jquery选择器中？需要编写ngRx选择器来选择给定日期范围内的数据吗？ngrx中订阅内的管道 Angular NgRx选择器无法读取未定义的属性 ngrx适配器选择器语法的含义是什么？如何将悬停选择器添加到样式对象？如何将日期选择器添加到forms Django

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

没有搜到相关的合辑

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭