错误TypeError:Observable_1.Observable.from不是函数

时间:2018-09-12 21:12:20

标签: angular redux observable

使用@select()和异步管道时出现问题 我下载了课程https://rutracker.org/forum/viewtopic.php?t=5433232,并在第6课上发现了此问题,然后一切正常。enter image description here ................................................... ................................................... ................................................... ....... app.component.ts

import {Component} from '@angular/core';
import {NgRedux, select} from 'ng2-redux';
import {IAppState} from './store';
import {INCREMENT} from './actions';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title: 'app';
  @select() counter;

  constructor(private ngRedux: NgRedux<IAppState>) {
  }

  increment() {
    this.ngRedux.dispatch({type: INCREMENT});
  }

}

app.component.html

<h1>{{title}}</h1>

<p>Counter: {{counter | async}}</p>

<button (click)="increment()">Increment</button>

app.module.ts

import {BrowserModule} from '@angular/platform-browser';
import {NgModule} from '@angular/core';

import {AppComponent} from './app.component';
import {CommonModule} from '@angular/common';
import {NgReduxModule, NgRedux} from 'ng2-redux';
import {IAppState, INITIAL_STATE, rootReducer} from './store';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    CommonModule,
    BrowserModule,
    NgReduxModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(ngRedux: NgRedux<IAppState>) {
    ngRedux.configureStore(rootReducer, INITIAL_STATE);
  }
}

actions.ts

export const INCREMENT = 'INCREMENT';

store.ts

import {INCREMENT} from './actions';

export interface IAppState {
  counter: number;
}

export const INITIAL_STATE: IAppState = {
  counter: 0
};

export function rootReducer(state: IAppState, action): IAppState {
  switch (action.type) {
    case INCREMENT:
      return {counter: state.counter + 1};
  }
  return state;
}

1 个答案:

答案 0 :(得分:0)

有两种建议的解决方法:

A)覆盖TypeScript编译器选项。 将下面的路径部分添加到src / tsconfig.app.json中的compileOptions中:

{
    "compilerOptions": {
        "paths": {
            "rxjs/internal/Observable": [
                "../node_modules/rxjs/_esm5/internal/Observable"
            ]
        }
    }
}

B)6.2.x版的Pin RxJS版本 您可以通过发出以下命令将应用程序锁定到不受影响的rxjs 6.2.x版本:

npm install --save rxjs@6.2 rxjs-compat@6.2