this.data.getUsers(...).subscribe is not a function - node.js

Question

fetching details from API and trying to list the same getting error while printing the list of users was able print with same code.
following is my home.component.ts
constructor(private formBuilder: FormBuilder, private data: DataService) { }
ngOnInit() {
this.data.getUsers().subscribe(data => {
this.users = data
console.log(this.users);
}
);
}
following is my data services code
getUsers() {
return this.http.get('https://reqres.in/api/users');
}
following is the html loop I am trying
<ul *ngIf="users">
<li *ngFor="let user of users.data">
<img [src]="user.avatar">
<p>{{ user.first_name }} {{ user.last_name }}</p>
</li>
</ul>

Answer 1

Re-Check this from your code Working Stackblitz
component.ts
import { Component, OnInit } from '#angular/core';
import { DataService } from './data.service';
#Component({
selector: 'my-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
users;
constructor(private data: DataService){}
ngOnInit() {
this.data.getUsers().subscribe(data => {
this.users = data ;
})
}
}
service.ts
import { Injectable } from '#angular/core';
import { HttpClient } from '#angular/common/http';
#Injectable()
export class DataService {
constructor(private http: HttpClient) { }
getUsers() {
return this.http.get('https://reqres.in/api/users');
}
}
component.html
<ul *ngIf="users">
<li *ngFor="let user of users.data">
<img [src]="user.avatar">
<p>{{ user.first_name }} {{ user.last_name }}</p>
</li>
</ul>

Answer 2

Worked... I cleared cache of npm and it worked ..