Angular 6:关于RxJs的模块未找到错误

时间:2018-05-27 13:29:41

标签: javascript node.js angular

我正在使用

  • Angular CLI:6.0.5
  • 节点:8.11.1
  • Angular:6.0.3
  • rxjs:6.2.0

编译Angular 6应用程序时出现错误,下面只是第一个

ERROR in ./src/app/web.service.ts
Module not found: Error: Can't resolve 'rxjs/add/operator/toPromise' in 
'C:\Node\ang\frontend\src\app'

我的 web.service.ts 代码

import { Http, Headers, Response } from '@angular/http';
import 'rxjs/add/operator/toPromise';

export class WebService{
    constructor(private http:Http){

    }
    getMessages(){
        return this.http.get("http://localhost:2000/messages").toPromise(); 
    }
} 

我的 app.module.ts 代码

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {NoopAnimationsModule} from '@angular/platform-browser/animations';
import {MatButtonModule,
  MatCardModule,
  MatSnackBarModule,
  MatToolbarModule,
  MatInputModule} from '@angular/material';

import { AppComponent } from './app.component';
import { WebService } from './web.service';
import { MessagesComponent } from './messages.component';
import {HttpModule} from '@angular/http';

@NgModule({
  declarations: [
    AppComponent,  MessagesComponent
  ],
  imports: [
    BrowserModule, HttpModule, NoopAnimationsModule, MatButtonModule, MatCardModule, MatSnackBarModule, MatToolbarModule, MatInputModule
  ],
  providers: [WebService],
  bootstrap: [AppComponent]
})
export class AppModule { }

我正在从Lynda.com视频教程学习Angular。我遵循每一步。但我得到了错误。

3 个答案:

答案 0 :(得分:11)

注释行:import'rxjs / add / operator / toPromise';

答案 1 :(得分:10)

您使用已弃用的HttpModule ,您应使用 HttpClientModule 代替

建议使用 Observables over promises 。通过转换为承诺,您将失去取消请求的能力以及链接RxJS运营商的能力 在使用HttpClient之前,您需要将Angular HttpClientModule导入根模块。

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

    @NgModule({
      imports: [
        BrowserModule,
        HttpClientModule,
      ],
//.......

修改后的代码:

import { HttpClient} from '@angular/http';
import {Observable} from 'rxjs';    

    export class WebService{
        constructor(private httpc:Http){}
        getMessages():Observable<any>{
            return this.httpc.get("http://localhost:2000/messages"); 
        }
    } 
  

关于你得到的错误

从rxjs 5.5.0-beta.5 +开始,toPromise方法现在是Observable的永久方法。您无需再导入 Reference

由于您正在使用RXJS 6+,我建议您浏览 Changes

LIVE DEMO WITH HTTPCLIENT

答案 2 :(得分:0)

在Angular 6之后,您将需要安装rxjs-compat软件包

npm install-保存rxjs-compat

更多信息,请看https://academind.com/learn/javascript/rxjs-6-what-changed/