访问阵列内的对象

Question

我无法访问数组的元素。 当我打印使用数组：

console.log(MyArray); 

我得到的控制台所示在图像中。

我已经从API中获得了这个数组的数据。 我不想在回调中访问它，但最终使用数据在地图上绘制标记。

我被困在这。

 private MyArray: any[] = []; 
    ngOnInit() { 
     this.httpservice.getdata().subscribe 
     (data=> 
     {this.MyArray.push(data);}); 

    console.log(MyArray[0]);//I am trying to access it here 

    var mapProp = { 
     center: new google.maps.LatLng(51.508742, -0.120850), 
     zoom: 10, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("googleMap"), 
    mapProp); 

    var markerarray: any[] = []; 



    //I want to eventually access the data here 

    for (i = 0; i < 21; i++) { 
     markerarray[i] = new google.maps.Marker({ 
     position: new google.maps.LatLng(MyArray[0][i].latitude, MyArray[i] 
    [i].longitude),   //In this line 
     title: MyArray[1][i].name, //and this 
     map: map 
     }); 


    } 

我httpservice.ts样子：

import { Injectable } from '@angular/core'; 
import { Http } from '@angular/http'; 
import { Observable } from 'rxjs/Observable'; 
import { Response, RequestOptions, Headers } from '@angular/http' 

@Injectable() 
export class HttpService { 

    constructor(private hhtp: Http) { } 
    getdata() { 
     return this.hhtp.get('url').map((res: Response) => { //the url which I am using 
      return res.json(); 
     }) 

    } 

} 

Answer 1

问题是你试图访问阵列已经返回订阅方法之前。

修改ngOnInit（）这样的，并尝试：

private MyArray: any[] = []; 
    ngOnInit() { 
    var mapProp = { 
      center: new google.maps.LatLng(51.508742, -0.120850), 
      zoom: 10, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 
    var map = new google.maps.Map(document.getElementById("googleMap"), 
        mapProp); 

    var markerarray: any[] = []; 
    this.httpservice.getdata().subscribe(
    (data)=> 
    { 
    this.MyArray.push(data); 
    console.log(MyArray[0]);//Access it here 

    //I want to eventually access the data here 

    for (i = 0; i < 21; i++) { 
     markerarray[i] = new google.maps.Marker({ 
     position: new google.maps.LatLng(MyArray[0][i].latitude, MyArray[i] 
    [i].longitude),   //In this line 
     title: MyArray[1][i].name, //and this 
     map: map 
     }); 
    } // end for 
    }); // end subscribe 
} // end ngOninit 

浏览器控制台会显示完整的数据，因为如果你看到整个图像的“我”，它会说“低于价值进行评估的工具提示现在'。这意味着当您在控制台中尝试访问数组中的对象时，其中没有对象值。

Answer 2

当你试图访问的元素？如果您尝试访问服务的结果之前访问，MyArray将仍为空。

如果尝试刚过data来访问一个元素，你应该看到它的工作：

private MyArray: any[] = []; 
ngOnInit() { 
    this.httpservice.getdata().subscribe 
    (data=> 
    { 
    this.MyArray.push(data); 

    console.log(MyArray[0][1].name); 
    }); 
} 

如果您要访问的服务方法之外，你必须确保服务功能已加载数据。

你可以等待它是这样的：

private MyArray: any[] = []; 

private IsDataLoaded: boolean = false; 

ngOnInit() { 
    this.httpservice.getdata().subscribe 
    (data=> 
    { 
    this.MyArray.push(data); 
    IsDataLoaded = true; 
    }); 
} 

while(true) { 
    if(IsDataLoaded) { 
     break; 
    } 
} 

// Or this 
//while(!IsDataLoaded) { 
// // do nothing but wait 
//} 

console.log(MyArray[0][1].name);