Question

我需要在回调函数中更新一个数组对象，我使用了以下几行，但是这些值在回调循环的范围内设置而不是作为角度变量，所以我的视图没有更新。（deviceval）值被更改如果我在回调中打印它，但在值之外仍然是旧的。

export class DashboardComponent implements OnInit {
  hideTable: boolean = true;
  public  deviceVal:any;
  constructor(private ref: ChangeDetectorRef) {}

  ngOnInit() {
    this.deviceVal = deviceData;
    console.log(this.deviceVal);
    var container = $('.map-canvas');
    var options = {
     center: new google.maps.LatLng(41.676258, -99.683199),
     zoom: 4,
     mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    gmap = new google.maps.Map(container[0], options);
    this.drawChart(deviceData);
    this.plotMarkers();
  }

  plotMarkers(){
    $.each(deviceData, function(key, val) {
      var controller=this;
      var marker = new google.maps.Marker({
        position: new google.maps.LatLng(parseInt(val.lat), parseInt(val.lon)),
        map: gmap,
      });
      google.maps.event.addListener(marker, 'click', function() {
        this.deviceVal = val;
      });
      markerCache.push(marker);
    })
  }
}

Answer 1

问题在于：

$.each(deviceData, function(key, val) {
  var controller=this;
  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(parseInt(val.lat), parseInt(val.lon)),
    map: gmap,
  });
  google.maps.event.addListener(marker, 'click', function() {
    this.deviceVal = val;
  });
  markerCache.push(marker);
})

当您使用function（）作为回调函数时，'this'值会更改。你最好在这里阅读一下这个。

您可以使用箭头功能解决此问题：

plotMarkers(){
    $.each(deviceData, (key, val) => {
      var marker = new google.maps.Marker({
        position: new google.maps.LatLng(parseInt(val.lat), parseInt(val.lon)),
        map: gmap,
      });
      google.maps.event.addListener(marker, 'click', () => {
        this.deviceVal = val;
      });
    })
  }

但是你还有很多其他问题，比如：你不需要使用jQuery（说实话，你应该避免使用ng2 app中的jQuery），'gmap'变量没有定义（你可以设置它）作为类的属性，正如您在'deviceVal'中所做的那样），'markerCache'也没有定义，没有drawChart方法，'deviceData'没有在plotMarkers（）中定义。

Answer 2

我通过在导出组件之前声明一个全局变量来解决它，如

var controller;

并在ngoninit（），

中初始化它

controller = this;

并将控制器传递给addlistener，

 google.maps.event.addListener(marker, 'click', () => {
                           controller.deviceVal=[];
                            controller.deviceVal.push(val);
                          //console.log(controller.deviceVal+"end....................................")
                          });

无法在回调函数

2 个答案: