Angular 6: Module not found error regarding RxJs

aasim bairagdar

I am using

  • Angular CLI: 6.0.5
  • Node: 8.11.1
  • Angular: 6.0.3
  • rxjs: 6.2.0

when Compiling the Angular 6 app I got errors, below is just the first one

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'

My web.service.ts code

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(); 
    }
} 

My app.module.ts code

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 { }

I am learning Angular from Lynda.com video tutorial. I follow each and every step. but I got the error.

Vikas

You are using HttpModule which is deprecated you should use HttpClientModule instead

it's recommended to use Observables over promises. By converting to a promise you will lose the ability to cancel a request and the ability to chain RxJS operators.
Before you can use the HttpClient, you need to import the Angular HttpClientModule into root Module.

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

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

Modified Code:

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"); 
        }
    } 

Regarding the error you are getting

As of rxjs 5.5.0-beta.5+ the toPromise method is now a permanent method of Observable. You don't need to import it anymore Reference

Since You are working with RXJS 6+ I would Recommend you to go through the Changes

LIVE DEMO WITH HTTPCLIENT

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Angular 4: Module not found error regarding RxJs

Angular 6 setTimeout Module not found: Error: Can't resolve 'timers'

Angular 6 - Module not found: Error: Can't resolve 'http' in

error about angular2-jwt, Cannot find module 'rxjs-compat/Observable (this module not works in Angular 6)

ERROR in "path" Module not found: Error: Can't resolve - Angular 6 Webpack

Angular 6 and AngularFire2 RxJS Error

Angular 6 : where getting error module "rxjs/add/operator/map" and another error 'map' does not exist on type 'Observable<Response>'

Error regarding angular directives

Update to Angular v6 - Module not found: Error: Can't resolve 'fs'

Importing jquery in Angular6 : Module not found: Error: Can't resolve 'jquery'

Module not found: Error: Can't resolve 'rxjs/add/observable/throw'

Need to fix error not found in module - Angular

How to keep observable alive after error in RxJS 6 and Angular 6

Angular 6 / RxJs 6 Observable merging that also skips to error block

Why image not found error come in angular 6?

'not found' error with proxy config in Angular 6

Error: Cannot find module "rxjs/operators" in Ionic Angular

Angular 404 Not Found regarding of the target URL

Angular 2 - Module not found: Error: Can't resolve '@angular/material'

Error: Module not found: Error: Can't resolve '@angular/cdk/scrolling'

swagger codegen --> angular6: rxjs observable compile error

Angular 6 / Rxjs - how to basics: observables success, error, finally

Compile error after update Angular and RxJS 5 to 6

Angular 8 - Module not found: Error: Can't resolve 'fs' in

Module not found: Error: Can't resolve '@angular/core'

Module not found: Error: Can't resolve '@angular/animations'

Angular 2: Module not found: Error: Can't resolve

Angular: Getting a module not found error only when building for prod

Angular 8 Animations Error on Lazy Loaded Module - Found Synthetic Property