Question

我正在尝试使用Angular 4和RANDOM USER API生成随机用户信息。每当我尝试将收到的数据打印到控制台以检查我是否得到了我想要的东西时，我总是得到“未定义”的消息而不是我想要打印的消息。我确实得到了一个随机用户的对象，其中包含我需要的所有参数，但是如何打印并从该对象中获取特定参数。如果有人向我解释，我真的很感激和欣赏。提前谢谢。

以下是我用来获取数据的服务代码：

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class UserdataService {

  constructor(private _http: Http) {
  }

  getUserData(){

    return this._http.get('https://randomuser.me/api/?inc=name,location,nat,picture')
    .map(res => res.json());

  }

}

这是组件代码，我在其中获取数据并尝试在控制台中打印它：

import { Component, OnInit } from '@angular/core';
import { UserdataService } from '../../services/userdata.service';

@Component({
  selector: 'app-controller',
  templateUrl: './controller.component.html',
  styleUrls: ['./controller.component.css']
})
export class ControllerComponent implements OnInit {

  constructor(private _randomUserService:UserdataService) {

   }

  ngOnInit() {

    this._randomUserService.getUserData().subscribe((data)=>{
      console.log(data.name);//Try to print the name of the user as example

    });
  }
}

Answer 1

您没有从API获取用户，您获得了更复杂的对象，您需要从该用户获取用户。所以在服务映射中，响应的结果属性为：

return this._http.get('https://randomuser.me/api/?inc=name,location,nat,picture')
    .map(res => res.json().results[0]);

生成随机用户信息Angular 4

1 个答案: