Angular 4-映射HTTP JSON响应

Question

I am trying to setup a mean stack crud application. The routes and the functionality is setup and tested using postman. I am getting correct responses for all the routes. Now I am trying to add the view part where the routes are called internally by the Angular application. I am trying to setup a basic get route. Following is my component code:

import { Component, OnInit } from '@angular/core';
import { UserService } from '../user.service';
@Component({
  selector: 'app-user',
  templateUrl: './user.component.html',
  styleUrls: ['./user.component.css']
})
export class UserComponent implements OnInit {
  users: {};
  constructor(private userService: UserService) { }
  ngOnInit() {
    this.getUsers();
  }
  getUsers() {
    this.userService.getAllUsers().subscribe(data => this.users = data);
  }
}

and the service contains the following code:

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';    
@Injectable()
export class UserService {    
  constructor(private http: Http) { }    
  getAllUsers() {
    this.http.get('/api/users')
      .map(res => res.json());
  }    
}

A sample response of the route using postman is as follows:

{
    "status": true,
    "err": null,
    "data": [
        {
            "_id": "59d5db344c46e83a14b94616",
            "name": "test"
        },
        {
            "_id": "59d5db3c4c46e83a14b94617",
            "name": "hello"
        }
    ]
}

It always telling me the following error: Property 'subscribe' does not exist on type 'void'.

What am I doing wrong? Can someone point me the standard way to do this?

Answer 1

Try this :

You forgot to return in your getAllUsers()

getAllUsers() {
   return this.http.get('/api/users')
      .map(res => res.json());
  }