Angular 2 Http在正文上获取返回类型3错误答案

【问题标题】：Angular 2 Http Get return type 3 error on bodyAngular 2 Http在正文上获取返回类型3错误
【发布时间】：2018-11-28 02:21:17
【问题描述】：

当我尝试从 asp.core api 返回响应时遇到问题 "angular 2 http get Object { _body: error, status: 0, ok: false, statusText: "", headers: {…}, type: 3, url: null }"

组件：

import { Component, OnInit } from '@angular/core';
import { IIndustryType } from '../../../model/IndustryType';
import { DeveloperJobDataService }from'../../../services/developerjob.dataservice';

@Component({
    selector: 'add-job',
    templateUrl: './addJob.component.html',
    styleUrls: ['./addJob.component.css'],
    providers: [DeveloperJobDataService]
})
export class AddJobComponent {
    errorMessage: string;
    private industry: IIndustryType[];

    constructor(private dataService: DeveloperJobDataService) {
        this.dataService.GetIndustries().subscribe(result => {
            this.industry = result.json() as IIndustryType[];
            console.log(this.industry);
        }, error => console.error(error));
    }
}

界面：

export interface IIndustryType {
    id: number,
    name: string,
    description: string,
    isActive: boolean,
    createdDate: Date
}

服务：

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

import { Observable } from 'rxjs/Observable';
import { Observer } from 'rxjs/Observer';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';

import { IIndustryType } from '../model/IndustryType';
import { IndustryType } from '../model/viewModel';

@Injectable()

export class DeveloperJobDataService {
    private baseUrl: string = 'http://localhost:49861/api/Industries';
    constructor(private http: Http) { }

    public GetIndustries() {
        return this.http.get(this.baseUrl);
    }
}

错误：

【问题讨论】：

你可以在组件的 subscribe 方法中添加一个console.log(result); 吗？并给我输出
同样的结果.... GET localhost:49861/api/Industries 200 (OK) 响应 {_body: ProgressEvent, status: 0, ok: false, statusText: "", headers: Headers, ...}跨度>
headers : Headers {_headers: Map(0), _normalizedNames: Map(0)} ok : false status : 0 statusText : "" type : 3 url : null _body : ProgressEvent {isTrusted: true, lengthComputable: false, 加载: 1, 总数: 0, type: "error", ...} proto : Body

标签： angular http

【解决方案1】：

你错过了requestOptions 中的 HTTP 方法，如下所示：

https://angular.io/api/http/Http#request

您的示例没有帖子正文；我猜你想使用 Http Get。如果不是，您可以根据自己的情况更改HttpMethod

  public GetIndustries() {
     return this.http.request(this.baseUrl,{
         method : 'Get' // or 'Post'
     });
  }

或者您可以使用get 代替request

public GetIndustries() {
   return this.http.get(this.baseUrl);
}

【讨论】：

如果我输入“get”，结果相同
您会从 chrome 或本地环境中的任何浏览器获得结果 http://localhost:49861/api/Industries 吗？
好的，我解决了，问题出在后端 EF 和数据库上。谢谢

【解决方案2】：

试试这个。

像这样更改您的 GetIndustries 方法。

public GetIndustries() Observable<IIndustryType[]>{
        return this.http.get<IIndustryType[]>(this.baseUrl);
}

然后在调用GetIndustries 方法的组件构造函数中进行这些更改。

 constructor(private dataService: DeveloperJobDataService) {
        this.dataService.GetIndustries().subscribe(result => {
            this.industry = result;
            console.log(this.industry);
        }, error => console.error(error));
 }

【讨论】：