Angular 如何从ngrx获取数据/从路由参数存储数据

如何在发送路线时将特定的产品详细信息从商店发送到其他页面？我已经尝试过实现这一点，但无法解决如何从其他路径为商店分派事件！参考以下文件

这是我的产品商店文件：

import { Action, ActionReducer } from '@ngrx/store';
import {Product} from "../product.model/product.model";
export const productStore: ActionReducer<Product[]> = (status: Product[] = [], action: Action) => {
    switch(action.type){
         case 'SET_LIST' : status = action.payload;
                           return status;
      case 'GET_PRODUCT' : return status;
                 default : return status;
    }
}

从'@ngrx/store'导入{Action，ActionReducer}；
从“./Product.model/Product.model”导入{Product}”；
导出常量productStore:ActionReducer=（状态：Product[]=[]，action:action）=>{
开关（动作类型）{
案例“设置列表”：状态=action.payload；
返回状态；
案例“获取产品”：退货状态；
默认：返回状态；
}
}

这是我使用ngrx/store的产品页面：

import { OnInit, Component } from '@angular/core';
import {Product} from "../../product.model/product.model";
import {AppService} from "../../app.service/app.service";
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
@Component({
  selector: 'product-pg',
  template: `
    Product List Goes Here:
    <ul>
      <li *ngFor = 'let product of $productList | async'>
        {{product.name}} - 
        <a [routerLink] = "['/product-details', product.id]">Edit</a>
      </li>
    </ul>
  `
})
export class ProductPageComponent implements OnInit{
   private $productList: Observable<Product[]>;

   constructor(private _service: AppService, private _store: Store<Product[]>){}

   ngOnInit(){
     this.$productList = this._store.select('productList');
     this._service.setProductList()
   }
}

从'@angular/core'导入{OnInit，Component}；
从“../../Product.model/Product.model”导入{Product}”；
从“../../app.service/app.service”导入{AppService}”；
从'@ngrx/Store'导入{Store}；
从“rxjs/Observable”导入{Observable}；
@组成部分({
选择器：'product pg'，
模板：`
产品列表如下：


{{product.name}}-
编辑


`
})
导出类ProductPageComponent实现OnInit{
私有$productList：可观察；
构造函数（私有_服务：AppService，私有_存储：store）{}
恩戈尼尼特（）{
this.$productList=this.\u store.select（'productList'）；
此._service.setProductList（）
}
}

在这里，我想获得单个产品详细信息-产品详细信息页面：

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
import {Product} from "../../product.model/product.model";
@Component({
  selector: 'product-details-page',
  template: `
    Product Details Page Goes Here...
    {{selectedProduct$ | async}}
  `
})
export class ProductDetailsPageComponent implements OnInit{
   private selectedProduct$:Observable<Product>;

   constructor(private route: ActivatedRoute, private _store :Store<Product>){}

   ngOnInit(){
     this.route.params.subscribe((param) => {
       console.log(param["id"])
       //Can't figure-out how to achieve this OR get store help here???
       this.selectedProduct$ = this._store.dispatch({type: 'GET_PRODUCT', payload: param["id"]});
     })
   }
}

从'@angular/core'导入{Component，OnInit}；
从'@angular/router'导入{ActivatedRoute}；
从'@ngrx/Store'导入{Store}；
从“rxjs/Observable”导入{Observable}；
从“../../Product.model/Product.model”导入{Product}”；
@组成部分({
选择器：“产品详细信息页面”，
模板：`
产品详细信息页面转到这里。。。
{{selectedProduct$| async}}
`
})
导出类ProductDetailsPageComponent实现OnInit{
私有选择产品$：可观察；
构造函数（私有路由：ActivatedRoute，私有_存储：存储）{}
恩戈尼尼特（）{
this.route.params.subscribe（（param）=>{
console.log（参数[“id”]）
//不知道如何实现这一点或在这里获得商店帮助？？？
this.selectedProduct$=this.u-store.dispatch（{type:'GET\u-PRODUCT'，负载：param[“id”]}）；
})
}
}

---

在这里，我无法借助route参数从商店获得单个产品的详细信息。如何做到这一点，请帮助我

dispatch

不返回可观察的。要从存储中检索状态，您需要

选择
它-如
ProductPageComponent
中所示。即使您需要发送一个操作来将详细信息加载到存储中，您仍然需要
选择
。感谢@cartant，这意味着无论我在哪里需要存储数据或数据片段，我都需要右键单击该组件中的_store.select（…）语句！！！