【发布时间】：2017-04-18 11:57:46
【问题描述】：
我正在使用 Angular 2 来显示来自 Restfull 服务的数据。
当我使用我的服务进行 api 调用时，可以看到 fitbits API 的 json 输出。但是当我想将数据映射到 angular2 类时，出现问题，我看不到数据。
constructor (private http: Http) {}
getHeartrates (): Promise<HeartRate> {
let headers = new Headers({ 'Authorization': 'Bearer eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiI1TE1ENkMiLCJhdWQiOiIyMjg5OUciLCJpc3MiOiJGaXRiaXQiLCJ0eXAiOiJhY2Nlc3NfdG9rZW4iLCJzY29wZXMiOiJyc29jIHJzZXQgcmFjdCBybG9jIHJ3ZWkgcmhyIHJudXQgcnBybyByc2xlIiwiZXhwIjoxNDkyNTIxMTQ0LCJpYXQiOjE0OTE5MTYzNDR9.aP44gsdkQXmlRlkN65cEVKXNmqMWZXECOMzP0tDJzng' });
headers.append('Accept', 'application/json');
let options = new RequestOptions({ headers: headers });
return this.http.get(this.heartrateUrl, options)
.toPromise()
.then(this.extractData)
.catch(this.handleError);
}
private extractData(res: Response) {
let body = res.json();
// let newbody = JSON.parse(body);
return body || {};
}
private handleError (error: Response | any) {
// In a real world app, we might use a remote logging infrastructure
let errMsg: string;
if (error instanceof Response) {
const body = error.json() || '';
const err = body.error || JSON.stringify(body);
errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
} else {
errMsg = error.message ? error.message : error.toString();
}
console.error(errMsg);
return Promise.reject(errMsg);
} export class HeartRate {
activities_heart: ActivitiesHeart[];
activities_heart_intraday: ActivitiesHeartIntraday;
}
class HeartRateZone {
caloriesOut: number;
max: number;
min: number;
minutes: number;
name: string;
}
class ActivitiesHeart {
customHeartRateZones: any[];
dateTime: string;
heartRateZones: HeartRateZone[];
value: string;
}
class Dataset {
time: string;
value: number;
}
class ActivitiesHeartIntraday {
dataset: Dataset[];
datasetInterval: number;
datasetType: string;
}<h2>Show something about heartrates</h2>
<p>{{ heartratelist?.activities_heart_intraday?.dataset[0]?.value }}</p>
<ul *ngFor="#item of heartratelist?.activities_heart_intraday?.dataset">
<li>{{item.value}}</li>
</ul>这是 json 返回的内容
{
"activities-heart": [{
"customHeartRateZones": [],
"dateTime": "today",
"heartRateZones": [{
"caloriesOut": 26.01129,
"max": 97,
"min": 30,
"minutes": 14,
"name": "Out of Range"
}, {
"caloriesOut": 0,
"max": 135,
"min": 97,
"minutes": 0,
"name": "Fat Burn"
}, {
"caloriesOut": 0,
"max": 164,
"min": 135,
"minutes": 0,
"name": "Cardio"
}, {
"caloriesOut": 0,
"max": 220,
"min": 164,
"minutes": 0,
"name": "Peak"
}],
"value": "58.62"
}],
"activities-heart-intraday": {
"dataset": [{
"time": "10:13:46",
"value": 65
}, {
"time": "10:21:13",
"value": 70
}, {
"time": "10:21:28",
"value": 70
}, {
"time": "10:21:33",
"value": 80
}, {
"time": "10:21:38",
"value": 79
}, {
"time": "10:21:43",
"value": 76
}, {
"time": "10:21:48",
"value": 73
}, {
"time": "10:21:53",
"value": 73
}, {
"time": "10:22:03",
"value": 67
}, {
"time": "10:22:08",
"value": 63
}, {
"time": "10:22:13",
"value": 59
}, {
"time": "10:22:23",
"value": 60
}, {
"time": "10:22:33",
"value": 61
}, {
"time": "10:22:43",
"value": 61
}, {
"time": "10:22:53",
"value": 62
}, {
"time": "10:23:03",
"value": 61
}, {
"time": "10:23:08",
"value": 62
}, {
"time": "10:23:13",
"value": 60
}, {
"time": "10:23:18",
"value": 60
}, {
"time": "10:23:23",
"value": 60
}, {
"time": "10:23:28",
"value": 59
}, {
"time": "10:23:33",
"value": 59
}, {
"time": "10:23:43",
"value": 60
}, {
"time": "10:23:58",
"value": 60
}, {
"time": "10:24:13",
"value": 60
}, {
"time": "10:24:23",
"value": 61
}, {
"time": "10:24:28",
"value": 59
}, {
"time": "10:24:33",
"value": 56
}, {
"time": "10:24:48",
"value": 56
}, {
"time": "10:24:53",
"value": 55
}, {
"time": "10:24:58",
"value": 56
}, {
"time": "10:25:13",
"value": 56
}, {
"time": "10:25:28",
"value": 55
}, {
"time": "10:25:33",
"value": 56
}, {
"time": "10:25:48",
"value": 56
}, {
"time": "10:25:58",
"value": 56
}, {
"time": "10:26:08",
"value": 57
}, {
"time": "10:26:18",
"value": 56
}, {
"time": "10:26:28",
"value": 56
}, {
"time": "10:26:43",
"value": 55
}, {
"time": "10:26:58",
"value": 54
}, {
"time": "10:27:13",
"value": 54
}, {
"time": "10:27:18",
"value": 54
}, {
"time": "10:27:28",
"value": 54
}, {
"time": "10:27:43",
"value": 53
}, {
"time": "10:27:58",
"value": 53
}, {
"time": "10:28:03",
"value": 54
}, {
"time": "10:28:18",
"value": 54
}, {
"time": "10:28:33",
"value": 53
}, {
"time": "10:28:48",
"value": 53
}, {
"time": "10:29:03",
"value": 53
}, {
"time": "10:29:08",
"value": 54
}, {
"time": "10:29:13",
"value": 53
}, {
"time": "10:29:18",
"value": 55
}, {
"time": "10:29:23",
"value": 57
}, {
"time": "10:29:38",
"value": 57
}, {
"time": "10:29:43",
"value": 56
}, {
"time": "10:29:53",
"value": 56
}, {
"time": "10:30:08",
"value": 56
}, {
"time": "10:30:13",
"value": 56
}, {
"time": "10:30:28",
"value": 55
}, {
"time": "10:30:43",
"value": 55
}, {
"time": "10:30:58",
"value": 55
}, {
"time": "10:31:13",
"value": 55
}, {
"time": "10:31:18",
"value": 54
}, {
"time": "10:31:33",
"value": 54
}, {
"time": "10:31:48",
"value": 54
}, {
"time": "10:32:03",
"value": 54
}, {
"time": "10:32:13",
"value": 56
}, {
"time": "10:32:28",
"value": 55
}, {
"time": "10:32:33",
"value": 55
}, {
"time": "10:32:38",
"value": 55
}, {
"time": "10:32:53",
"value": 56
}, {
"time": "10:33:08",
"value": 56
}, {
"time": "10:33:13",
"value": 61
}, {
"time": "10:33:23",
"value": 60
}, {
"time": "10:33:33",
"value": 61
}, {
"time": "10:33:48",
"value": 61
}, {
"time": "10:34:03",
"value": 61
}, {
"time": "10:34:08",
"value": 60
}, {
"time": "10:34:23",
"value": 60
}],
"datasetInterval": 1,
"datasetType": "second"
}
}感谢您的帮助！
【问题讨论】：