Angular6 类型';上不存在属性分派;可观察<;任何>';在angular 6中使用redux时出现问题

Angular6 类型';上不存在属性分派;可观察<;任何>';在angular 6中使用redux时出现问题,angular6,angular-redux,Angular6,Angular Redux,我正在尝试用angular 6做简单的redux应用程序 减速器.ts import { login,logout } from '../actions/actions'; export interface appReducer { login:boolean, user:String } const initialstate:appReducer={ login:false, user:'guest' } export function reducer(stat

我正在尝试用angular 6做简单的redux应用程序

减速器.ts

import { login,logout } from '../actions/actions';
export interface appReducer {
    login:boolean,
    user:String
}
const initialstate:appReducer={
    login:false,
    user:'guest'
}
export function reducer(state=initialstate,action):appReducer {
    switch(action.type) {
        case login:
            return {...state,login:true,user:action.payload}
        case logout:
            return {...state,login:false,user:action.payload}   
    }
    return state;
}
export const login="LOGIN";
export const logout="LOGOUT"
import { reducer,appReducer } from './reducer';
import { ActionReducerMap }  from '@ngrx/store';
interface appState {
    appReducer:appReducer;
}
export const reducers:ActionReducerMap<appState>= {
    appReducer:reducer
}
import { Injectable } from '@angular/core';
import { HttpClient,HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { Store }  from '@ngrx/store';
export class RecordsService {
  getLogin:boolean=false;
  constructor(private http:HttpClient,private store:Store<any>) { 
    this.recordFunc();
  }
     getState() {
        return this.store.select('appReducer');
      }
      updateState(action) {
        if(action.login==true) {
            return this.store.select('appReducer').dispatch({
                type:'LOGIN',
                payload:action.uname
            })
        }
        else {
            return this.store.select('appReducer').dispatch({
                type:'LOGOUT',
                payload:action.uname
            })
        }   
      }
}
动作。ts

import { login,logout } from '../actions/actions';
export interface appReducer {
    login:boolean,
    user:String
}
const initialstate:appReducer={
    login:false,
    user:'guest'
}
export function reducer(state=initialstate,action):appReducer {
    switch(action.type) {
        case login:
            return {...state,login:true,user:action.payload}
        case logout:
            return {...state,login:false,user:action.payload}   
    }
    return state;
}
export const login="LOGIN";
export const logout="LOGOUT"
import { reducer,appReducer } from './reducer';
import { ActionReducerMap }  from '@ngrx/store';
interface appState {
    appReducer:appReducer;
}
export const reducers:ActionReducerMap<appState>= {
    appReducer:reducer
}
import { Injectable } from '@angular/core';
import { HttpClient,HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { Store }  from '@ngrx/store';
export class RecordsService {
  getLogin:boolean=false;
  constructor(private http:HttpClient,private store:Store<any>) { 
    this.recordFunc();
  }
     getState() {
        return this.store.select('appReducer');
      }
      updateState(action) {
        if(action.login==true) {
            return this.store.select('appReducer').dispatch({
                type:'LOGIN',
                payload:action.uname
            })
        }
        else {
            return this.store.select('appReducer').dispatch({
                type:'LOGOUT',
                payload:action.uname
            })
        }   
      }
}
index.ts

import { login,logout } from '../actions/actions';
export interface appReducer {
    login:boolean,
    user:String
}
const initialstate:appReducer={
    login:false,
    user:'guest'
}
export function reducer(state=initialstate,action):appReducer {
    switch(action.type) {
        case login:
            return {...state,login:true,user:action.payload}
        case logout:
            return {...state,login:false,user:action.payload}   
    }
    return state;
}
export const login="LOGIN";
export const logout="LOGOUT"
import { reducer,appReducer } from './reducer';
import { ActionReducerMap }  from '@ngrx/store';
interface appState {
    appReducer:appReducer;
}
export const reducers:ActionReducerMap<appState>= {
    appReducer:reducer
}
import { Injectable } from '@angular/core';
import { HttpClient,HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { Store }  from '@ngrx/store';
export class RecordsService {
  getLogin:boolean=false;
  constructor(private http:HttpClient,private store:Store<any>) { 
    this.recordFunc();
  }
     getState() {
        return this.store.select('appReducer');
      }
      updateState(action) {
        if(action.login==true) {
            return this.store.select('appReducer').dispatch({
                type:'LOGIN',
                payload:action.uname
            })
        }
        else {
            return this.store.select('appReducer').dispatch({
                type:'LOGOUT',
                payload:action.uname
            })
        }   
      }
}
从“/reducer”导入{reducer,appReducer};
从'@ngrx/store'导入{ActionReducerMap};
接口应用状态{
评价者:评价者;
}
导出常量缩减器:ActionReducerMap={
评价者:减速机
}
记录.服务.ts

import { login,logout } from '../actions/actions';
export interface appReducer {
    login:boolean,
    user:String
}
const initialstate:appReducer={
    login:false,
    user:'guest'
}
export function reducer(state=initialstate,action):appReducer {
    switch(action.type) {
        case login:
            return {...state,login:true,user:action.payload}
        case logout:
            return {...state,login:false,user:action.payload}   
    }
    return state;
}
export const login="LOGIN";
export const logout="LOGOUT"
import { reducer,appReducer } from './reducer';
import { ActionReducerMap }  from '@ngrx/store';
interface appState {
    appReducer:appReducer;
}
export const reducers:ActionReducerMap<appState>= {
    appReducer:reducer
}
import { Injectable } from '@angular/core';
import { HttpClient,HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { Store }  from '@ngrx/store';
export class RecordsService {
  getLogin:boolean=false;
  constructor(private http:HttpClient,private store:Store<any>) { 
    this.recordFunc();
  }
     getState() {
        return this.store.select('appReducer');
      }
      updateState(action) {
        if(action.login==true) {
            return this.store.select('appReducer').dispatch({
                type:'LOGIN',
                payload:action.uname
            })
        }
        else {
            return this.store.select('appReducer').dispatch({
                type:'LOGOUT',
                payload:action.uname
            })
        }   
      }
}
从'@angular/core'导入{Injectable};
从'@angular/common/http'导入{HttpClient,HttpHeaders};
从“rxjs”导入{Observable};
从'@ngrx/Store'导入{Store};
导出类记录服务{
getLogin:boolean=false;
构造函数(私有http:HttpClient,私有存储:存储){
this.recordFunc();
}
getState(){
返回此.store.select('appReducer');
}
不动产(行动){
if(action.login==true){
返回此.store.select('appReducer')。分派({
类型:'LOGIN',
有效载荷:action.uname
})
}
否则{
返回此.store.select('appReducer')。分派({
类型:'LOGOUT',
有效载荷:action.uname
})
}   
}
}
在上面的代码中,我创建了reducer并成功地在store模块中注册。然后我在我的服务(records.service.ts)文件中导入了该存储。通过订阅我的getState(),我获得了我的当前状态,但当我调用updateState()时要分派更新状态的操作,它会在我的终端中显示以下错误,并更新我的状态

ERROR in src/app/records.service.ts(69,44): error TS2339: Property 'dispatch' does not exist on type 'Observable<any>'.
src/app/records.service.ts(75,42): error TS2339: Property 'dispatch' does not exist on type 'Observable<any>'.
src/app/records.service.ts(69,44)中的错误:错误TS2339:类型“Observable”上不存在属性“dispatch”。
src/app/records.service.ts(75,42):错误TS2339:类型“Observable”上不存在属性“dispatch”。

我面临同样的问题,并找到了一个快速解决方案


不要使用
store.select('appReducer').dispatch
只需使用
store.dispatch

像这样使用.store.dispatch({type:'LOGOUT',payload:action.uname})