这是我的组件文件:
import { Component, OnInit } from '@angular/core';
import { CclcService } from '../cclc.service';
import {HttpClient,HttpHeaderResponse,HttpClientModule} from '@angular/common/http';
import { ICurrencyData } from './ICurrencyData';
import { Currency } from './Currency';
@Component({
selector: 'app-cryto-currencies-list',
templateUrl: './cryto-currencies-list.component.html',
styleUrls: ['./cryto-currencies-list.component.css']
})
export class CrytoCurrenciesListComponent implements OnInit {
constructor(private cclcService: CclcService ) {
console.log('cclc component called');
}
public list : Currency;
ngOnInit() {
this.getCurrencyList();
}
public getCurrencyList()
{
this.cclcService.getCryptoCurrencyList().subscribe(data => {
console.log(data);
this.list = data;
console.log(this.list );
})
}
}
import { Injectable } from '@angular/core';
import {HttpClient,HttpHeaderResponse,HttpClientModule,HttpErrorResponse} from '@angular/common/http';
import { Observable } from "rxjs";
import { CanActivate, Router, ActivatedRouteSnapshot, RouterStateSnapshot,ActivatedRoute } from '@angular/router';
import { ICurrencyData } from './cryto-currencies-list/ICurrencyData';
import { Currency } from './cryto-currencies-list/Currency';
@Injectable({
providedIn: 'root'
})
export class CclcService {
private list : ICurrencyData[];
constructor(private httpClient:HttpClient ,private data:ICurrencyData,private resp: HttpHeaderResponse,private route:Router,actRoute:ActivatedRoute) {
console.log('cclc service constructor called');
resp.headers.set('Access-Control-Allow-Origin', '*');
}
private baseUrl = 'https://pro-api.coinmarketcap.com/';
private apiKey= 'bf8bbb9e-a227-46cb-862d-53a9ad3bbe51';
public getCryptoCurrencyList() : Observable<Currency>
{
return this.httpClient.get<Currency>(this.baseUrl +
'v1/cryptocurrency/listings/latest?CMC_PRO_API_KEY=' + this.apiKey)
console.log('service');
}
}
我正在通过使用http客户端模块的服务调用Web api get操作。但是,从组件调用订阅方法后,数据将返回null。通过邮递员调用请求时,它工作得很好。
理想情况下,它应该返回json结果。
但是在成功完成订阅请求后将数据获取为空
cclc service constructor called
cryto-currencies-list.component.ts:18 cclc component called
cclc.service.ts:30 service
cclc.service.ts:31 Observable {_isScalar: false, source: Observable, operator: MapOperator}
cryto-currencies-list.component.ts:28 null
cryto-currencies-list.component.ts:30 null