Uncaught TypeError: Cannot read property 'push' of undefined while pushing data in public array

Question

我正在尝试在函数调用时将一些值推送到数组中。我在函数中得到了 vaues，但是当我试图将这些值推送到数组中时，我收到错误 Cannot read 属性 'push' of undefined。但是，我已根据打字稿格式将数组初始化为 public 。但是，我无法找到我做错的地方。我是 angular 的新手，所以请原谅愚蠢的错误。

    export class AppHome
    {
      public pick_markers:Array<object> = [];
      public dest_markers:Array<object> = [];   

      constructor(private mapsAPILoader: MapsAPILoader, private ngZone: NgZone) {}

      ngOnInit() {
        this.codeAddress('Av. da Liberdade, 1250-096 Lisboa, Portugal','pickup');
      }

      codeAddress(address: string,type) {
        console.log(address);
        var geocoder = new google.maps.Geocoder();
        let latlng:any;
        geocoder.geocode({ 'address': address }, function (results, status) {
          console.log(status);
          if (status == google.maps.GeocoderStatus.OK) {
            let get_lat = results[0].geometry.location.lat();
            let get_lng = results[0].geometry.location.lng();
            if(type=='dest') {
              this.dest_markers.push({lat:+get_lat,lng:+get_lng});
              console.log(this.dest_markers);                       
            } else if(type='pickup') {
              this.pick_markers.push({lat:+get_lat,lng:+get_lng});
              console.log('pickuplatlng--lat::'+this.lat+',,,lng::'+this.lng);
            } else {
              console.log('no input');
            }
          } else {
            alert("Request failed.")
          }
        });
      }
    }

Answer 1

此错误是由于数组初始化错误造成的。

这样初始化数组，就可以了

 dest_markers :Array<any>=[];
 pick_markers :Array<any>=[];

Answer 2

您指向错误 this，使用箭头函数或存储上下文，如下例所示：

    export class AppHome
    {
      public pick_markers:Array<object> = [];
      public dest_markers:Array<object> = [];   

      constructor(private mapsAPILoader: MapsAPILoader, private ngZone: NgZone) {}

      ngOnInit() {
        this.codeAddress('Av. da Liberdade, 1250-096 Lisboa, Portugal','pickup');
      }

      codeAddress(address: string,type) {
        console.log(address);
        var geocoder = new google.maps.Geocoder();
        let latlng:any;
        geocoder.geocode({ 'address': address }, (results, status) => {
          console.log(status);
          if (status == google.maps.GeocoderStatus.OK) {
            let get_lat = results[0].geometry.location.lat();
            let get_lng = results[0].geometry.location.lng();
            if(type=='dest') {
              this.dest_markers.push({lat:+get_lat,lng:+get_lng});
              console.log(this.dest_markers);                       
            } else if(type='pickup') {
              this.pick_markers.push({lat:+get_lat,lng:+get_lng});
              console.log('pickuplatlng--lat::'+this.lat+',,,lng::'+this.lng);
            } else {
              console.log('no input');
            }
          } else {
            alert("Request failed.")
          }
        });
      }
    }

或：

    export class AppHome
    {
      public pick_markers:Array<object> = [];
      public dest_markers:Array<object> = [];   

      constructor(private mapsAPILoader: MapsAPILoader, private ngZone: NgZone) {}

      ngOnInit() {
        this.codeAddress('Av. da Liberdade, 1250-096 Lisboa, Portugal','pickup');
      }

      codeAddress(address: string,type) {
        console.log(address);
        var geocoder = new google.maps.Geocoder();
        let latlng:any;
        const self = this; // <= store context
        geocoder.geocode({ 'address': address }, function (results, status) {
          console.log(status);
          if (status == google.maps.GeocoderStatus.OK) {
            let get_lat = results[0].geometry.location.lat();
            let get_lng = results[0].geometry.location.lng();
            if(type=='dest') {
              self.dest_markers.push({lat:+get_lat,lng:+get_lng});
              console.log(this.dest_markers);                       
            } else if(type='pickup') {
              self.pick_markers.push({lat:+get_lat,lng:+get_lng});
              console.log('pickuplatlng--lat::'+this.lat+',,,lng::'+this.lng);
            } else {
              console.log('no input');
            }
          } else {
            alert("Request failed.")
          }
        });
      }
    }

为了更好，您可以定义一个接口来声明对象的形状，如下所示：

interface Coords {
  lat: number;
  lng: number
}

public pick_markers:Array<Coords> = [];
public dest_markers:Array<Coords> = [];

有关更多解决方案，请阅读此主题：

Answer 3

我认为问题出在数组声明上。

尝试，

pick_markers: any[];
dest_markers: any[];

this.pick_markers.push('data');
this.dest_markers.push('data');

Uncaught TypeError: Cannot read property 'push' of undefined while pushing data in public array

Uncaught TypeError: Cannot read property 'push' of undefined while pushing data in public array

angular

angular7