Question

我是Angular 4的新手，我试图使用api制作简单的应用。但Get请求不起作用，我不明白问题所在。

我的服务：

import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';

import 'rxjs/add/operator/map';

@Injectable()
export class RequestService {

// persos:any;


constructor(private http:Http) {

    this.getPersos();

}

getPersos() {

    return this.http.get(this.apiUrl + 'people/')
        .map(response => {
            return response.json(),
            console.log(response.json());
        })
}

我的组件文件：

import { Component, OnInit } from '@angular/core';
import { Http, Response, RequestOptions } from '@angular/http';
import { RequestService } from '../services/requests.service'

@Component({
  selector: 'persos',
  templateUrl: './persos.component.html',
  styleUrls: ['./persos.component.css'],
  providers: [RequestService]
})


export class PersosComponent implements OnInit {

constructor(private requestService:RequestService) {
    console.log(this.persos);
}

title = 'List des personnages';
persos;

ngOnInit() {

    this.requestService.getPersos()
        .subscribe(persos => {
            this.persos = persos;
            console.log(this.persos);
        }) 
}

}

在服务文件中，我将一个日志返回给我好的数据，然后在组件文件中的console.log返回＆＃39; undefined＆＃39;。

我还没有找到解决方案。谢谢你提前。

Answer 1

在订阅中添加您的console.log，您的组件方法方法也应该

php artisan queue:listen

，您的服务应该是，

 this.requestService.getPersos().subscribe(persos => {
        this.persos = persos;
        console.log(this.persos);
 });

Answer 2

您是否可以确认您尝试访问的API网址是否存在？另外，我对这段代码有点怀疑。

return this.http.get(this.apiUrl + 'people/')
    .map(response => {
        response.json(),
        console.log(response.json());
    })

你有response => {response.json(), console.log(response.json());})，我感觉自己无法工作。

此外，当您subscribe()观察时，您不会将该值设置为订阅。您可以在subscribe（）调用中的函数中设置值。

this.requestService.myMethod().subscribe(result => {
    this.persos = result;
    console.log(this.persos);
});

获取请求不起作用 - Angular 4

2 个答案: