最近我一直在努力学习ngrx,我跟着一个指南。我所遵循的指南的代码与我的相同,但我得到了这个错误:
Type 'Observable<void>' is not assignable to type 'Observable<IComment[]>'.
Type 'void' is not assignable to type 'IComment[]'.
字符串
我在commentComponent的构造函数中的isLoading$和comments$处都得到了错误:
import { Component, OnInit } from '@angular/core';
import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs';
import * as CommentActions from './store/comment.actions'
import { AppStateInterface } from 'src/app/types/appState.interface';
import { commentsSelector, isLoadingSelector } from './store/comment.selector';
import { IComment } from 'src/app/shared/interfaces/comment';
@Component({
selector: 'app-comment',
templateUrl: './comment.component.html',
styleUrls: ['./comment.component.css'],
})
export class CommentComponent implements OnInit {
isLoading$: Observable<boolean>
comments$: Observable<IComment[]>;
constructor(private store: Store<AppStateInterface>) {
this.isLoading$ = this.store.pipe(select(isLoadingSelector))
this.comments$ = this.store.pipe(select(commentsSelector))
}
ngOnInit(): void {
this.store.dispatch(CommentActions.getComments())
}
}
型
我想我的问题在于选择器的某个地方,但我找不到它。
import { createSelector, select } from '@ngrx/store';
import { AppStateInterface } from 'src/app/types/appState.interface';
export const selectFeature = (state: AppStateInterface) => state.comments;
export const isLoadingSelector = createSelector(selectFeature, (state) => {
state.isLoading;
});
export const commentsSelector = createSelector(selectFeature, (state) => {
state.comments;
});
export const errorSelector = createSelector(selectFeature, (state) => {
state.error;
});
型
由于它的代码太多,我将在这里粘贴仓库,所以任何人都可以检查出来。ngrx代码主要在./movies/comment/store文件夹中。https://github.com/kris34/Movies/tree/main/Client/movies-project/src/app/movie
3条答案
按热度按时间oymdgrw71#
在选择器中缺少return语句,因此使用
void
而不是IComment[]
:字符串
或者通过移除curly来使用隐式返回:
型
yftpprvb2#
选择器定义不正确。在当前的选择器定义中,没有返回任何值,这将导致类型被推断为void。尝试修改选择器函数以返回适当的值
例如,在
字符串
tpgth1q73#
作为其他评论的答案,您需要返回评论。下面是它的样子:
字符串
或者,如果你想要显式的函数体,那么这个:
型
我在想,你要么是自己没注意到,要么是你不知道箭头功能是如何工作的。提醒一下,如果你这样做:
型
这意味着“隐式返回”。在
=>
箭头之后,直接写下从myFn函数返回的表达式。如果在箭头后面打开花括号(
() => { ... }
版本),则必须显式返回所需的内容。