我正在尝试访问阵列。使用console.log时,按索引显示时未定义;如果显示整体,则为Array []。这些值被推送到NgOnInit之外,这就是为什么我能够获取newdates数组而不是这个数组的原因。 我不知道该怎么做。我需要将这些值传递到图形中。
public min_temp = new Array();
使用新的Array给我
Array(7)
0: 27.4
1: 28.7
2: 28.2
3: 28.9
4: 32.4
5: 30.2
6: 30.7
length: 7
但是当我使用索引显示时仍未定义
console.log(this.newdates);
给出
(7) ["2019-03-30", "2019-03-31", "2019-04-01", "2019-04-02", "2019-04-03", "2019-04-04", "2019-04-05"]
0: "2019-03-30"
1: "2019-03-31"
2: "2019-04-01"
3: "2019-04-02"
4: "2019-04-03"
5: "2019-04-04"
6: "2019-04-05"
length: 7
代码:
public weatherSearchForm: FormGroup;
public weatherData: any;
public show = 0;
public weatherDataNext: any;
public weatherDataHistory: any;
public date: Date;
public newdates = [];
public history_data = [];
public min_temp = new Array();
public max_temp = [];
public avg_temp = [];
chart = [];
dataSource: Object;
chartConfig: Object;
constructor(
private formBuilder: FormBuilder,
private apixuService: ApixuService,
private datePipe: DatePipe,
) {}
ngOnInit() {
this.weatherSearchForm = this.formBuilder.group({
location: [""]
});
for (let i = 6; i >=0; i--) {
this.date = new Date();
this.date.setDate( this.date.getDate() - i );
this.newdates.push(this.datePipe.transform(this.date,"yyyy-MM-dd"));
}
console.log(this.newdates);
}
sendToAPIXU(formValues) {
this.apixuService.getWeather(formValues.location).subscribe(data => {
this.weatherData = data;
console.log(this.weatherData);
});
this.apixuService.getNextWeather(formValues.location).subscribe(data => {
this.weatherDataNext = data;
console.log(this.weatherDataNext);
});
for (let i = 1; i < 8; i++)
{
this.apixuService.getHistoryWeather(formValues.location,this.newdates[i-1]).subscribe(data => {
this.weatherDataHistory = data;
this.history_data.push(data);
this.min_temp.push(this.weatherDataHistory.forecast.forecastday[0].day.mintemp_c);
this.max_temp.push(this.weatherDataHistory.forecast.forecastday[0].day.maxtemp_c)
this.avg_temp.push(this.weatherDataHistory.forecast.forecastday[0].day.avgtemp_c);
});
}
console.log("Min_temp");
console.log(this.min_temp);
console.log(this.min_temp[1]);
.
.
.
.
答案 0 :(得分:3)
由于this.apixuService.getHistoryWeather
调用是异步的,因此您需要在控制台内部移动订阅,在此代码行之后,它将立即
this.apixuService.getHistoryWeather(formValues.location,this.newdates[i-1]).subscribe(data => {
this.weatherDataHistory = data;
this.history_data.push(data);
this.min_temp.push(this.weatherDataHistory.forecast.forecastday[0].day.mintemp_c);
this.max_temp.push(this.weatherDataHistory.forecast.forecastday[0].day.maxtemp_c)
this.avg_temp.push(this.weatherDataHistory.forecast.forecastday[0].day.avgtemp_c);
console.log("Min_temp");
console.log(this.min_temp);
console.log(this.min_temp[1]);
});
}
答案 1 :(得分:1)
在将this.min_temp
数据传递到图形之前,您应该等待所有可观测值返回。您可以使用RxJS的forkjoin等待所有订阅完成。
const observableDataList: Observable[] = [];
for (let i = 1; i < 8; i++) {
observableDataList.push(this.apixuService.getHistoryWeather(formValues.location,this.newdates[i-1]));
}
Observable.forkJoin(observableDataList)
.subscribe(response => {
//console.log(response);
// the above should print out all the data after looping through all 8 iterations
// this.min_temp = ....
.
.
});