ScheduleModule: error TS2304: Cannot find name 'HttpClient'.

[sudhirkumart]

All,

I am trying to use Schedule module from PRIMENG and trying to render eventservice by calling HTTPClient module. System throws following compile error, despite of exporting HTTPclient and HTTPmodule

Service class:

@Injectable()
export class EventService {
constructor(private httpClient: HttpClient) {}

getEvents() {
return this.httpClient
.get('showcase/resources/data/scheduleevents.json')
.toPromise()
.then(res => <any[]>res.json().data)
.then(data => {
return data;
});
}
}

Importing following classes:
import { HttpClientModule } from '@angular/common/http';
import { HttpModule } from '@angular/http';
import { Injectable } from '@angular/core';
.
.
.
import {
RadioButtonModule,
KeyFilterModule,
DialogModule,
DropdownModule,
InputTextModule,
ScheduleModule,
TabViewModule,
MessagesModule,
} from 'primeng/primeng';

Can someone help me resolving the above issue?

FYI: I am using following Angular version:
Angular CLI: 6.0.8
Node: 8.11.3
OS: win32 ia32
Angular: 6.0.9

[sudhirkumart]

Can someone help in this regard?

Thanks!

[cagatay.civici]

You need to import HttpClientModule to your appmodule.

[sudhirkumart]

Thanks for the reply!

If you see my code, I have imported the Httpclientmodule. Still, I am seeing the problem

Is there anything I am missing on the same?

Thanks again!
Sudhir

[sudhirkumart]

I could resolve compile error, however there is some run-time error.

Following steps are followed to resolve compile error:

**appmodule.ts**

Code: Select all

  `import { HttpClientModule } from '@angular/common/http'; 
    
    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        ScheduleModule,
        HttpClientModule
      ],
      providers: [],
      bootstrap: [AppComponent]
    })

**AppComponent.ts(Your page):**

Code: Select all

    import { OnInit, Component, ViewEncapsulation, Injectable } from '@angular/core';
    import { ScheduleModule } from 'primeng/schedule';
    import { Http } from '@angular/http';


    export class EventService {
    
      constructor(private http: Http) { }
    
      getEvents() {
        return this.http.get('showcase/resources/data/scheduleevents.json')
          .toPromise()
          .then(res => <any[]>res.json().data)
          .then(data => data);
      }
    }

Now,it throws following run-time error, can someone please help me? Thanks you much!

I am not sure, whats the error:

compiler.js:1016 Uncaught Error: Can't resolve all parameters for AppComponent: (?).
at syntaxError (compiler.js:1016)
at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getDependenciesMetadata (compiler.js:10917)
at

[sudhirkumart]

Now, I am able to show events on the calendar by calling and writing the following method:

loadEvents(event) {
this.events = [ { title: 'All Day Event', description: 'testing', start: '2018-08-07' },
{ title: 'Doctor visit', start: '2018-08-01T09:00:00', end: '2018-08-01T10:30:00' },
{ title: 'Long test', start: '2018-02-05', end: '2018-02-05' },
{ title: 'Patiet Consultant', start: '2018-08-11T16:00:00' },
{ title: 'Repeating Event', start: '2018-08-16T16:00:00' },
{ title: 'Conference', start: '2018-08-01', end: '2018-08-03' }
]
}
}

However, I am not able to retrieve events through the following(event service from PRIMENG website) method:

@Injectable()
export class EventService {

constructor(private http: HttpClient) { }

getEvents() {
return this.http.get<any>('assets/showcase/data/scheduleevents.json')
.toPromise()
.then(res => <any[]>res.data)
.then(data => { return data; });
}

Can someone please throw some light on the same?

[JACrazy]

on your app.component.ts import httpclient not http. http is deprecated.

Code: Select all

import { HttpClient } from '@angular/common/http';

[sudhirkumart]

Yeahs thats correct, I was able to solve the problem.

Appreciate your feedback!