Question

不推荐使用以下ngrx选择。

this.store.select(state => state.academy.academy).subscribe((academy) => {
    this.academy = academy;
});

我在store.d.ts找到了

@deprecated from 6.1.0. Use the pipeable `select` operator instead.

那么...正确的语法是什么？

我尝试

this.store.pipe(select(state => state.academy.academy).subscribe((academy) => {
    this.academy = academy;
}))

错误：找不到名称“选择”。您是说'onselect'吗？

Answer 1

import {Component, OnInit} from '@angular/core';
import {Store, select} from '@ngrx/store';
import {AppState} from '../../../../../app.state';

@Component({
   selector: 'app-layout',
   templateUrl: './layout.component.html',
   styleUrls: ['./layout.component.scss']
})
export class PageLayoutComponent implements OnInit {

   academy;

   constructor(
      private store: Store<AppState>
   ) {
   }

   ngOnInit() {
      this.store.pipe(select((state: any) => state.academy.academy)).subscribe((academy) => {
         this.academy = academy;
      });
   }


}

Answer 2

根据NgRx 7，不推荐使用select方法。

有关更多信息，请参阅相关的Pull Request。

Answer 3

如@Michalis所述，只需从select中获取@ngrx/store。

选择器使您能够为应用程序状态编写一个读取模型。就CQRS架构模式而言，NgRx将读取模型（选择器）与写入模型（缩减器）分开。一种高级技术是将选择器与RxJS可管道运算符结合在一起。

此功能已添加到v5.0.0中，此后this.store.select()被弃用。但是，在版本v6.1.0中添加了相同的注意事项。随着Store<T>本身扩展Observable<T>，它返回observable，可以使用.subscribe()轻松订阅，也可以使用不同的补丁运算符对其进行操作/转换。

RxJS在v5.5中引入了可点运算符和.pipe()。还有一个管道实用程序功能，可用于构建可重用的可管道运算符。在版本v5中，借助pipe()自定义select运算符进行了构建。请查看下面的link或基本示例（忽略空状态），以了解更多信息。

import { select } from '@ngrx/store';
import { pipe } from 'rxjs';
import { filter } from 'rxjs/operators';

export const selectFilteredState = pipe(
  select('sliceOfState'),
  filter(state => state !== undefined)
);

store.pipe(selectFilteredState ).subscribe(/* .. */);

Ngrx 6.1.0-不建议使用Select-新语法是什么？

3 个答案: