繁体   English   中英

添加事件侦听器:如何在打字稿角度添加偶数侦听器?

[英]Add Event Listener : How to Add even listener in typescript angular?

我正在使用google-maps并且在单击要通过数据库获取的坐标时显示标记。 他们工作正常。 但是现在我想在标记的单击上显示位置的标题,但是我不知道将事件侦听器的代码放在哪里。

下面是我的app.component.ts

app.comp.ts

import { AfterViewInit, Component } from '@angular/core';
import { Observable } from 'rxjs/Rx';
import { ProductService } from './product.service';

declare var google: any;

// Islamabad Cordinates ===================================================
var myLatLng = { lat: 33.7294, lng: 73.0931 };

// Declaare Map  ==========================================================
var map;

// Markers array to push all marker ======================================
var markers = [];

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [ProductService]
})
export class AppComponent {

  //define an array of products
  products = [];

  //constructor func
  constructor(private _productService: ProductService) { }

  //after constructor func this func runs , in which we are
  // accessing the class function getproducts and objects products
  // through this.
  // => means callback in which we are dumping data in products
  //array
  ngOnInit() {
    this._productService.getProducts()
      .subscribe(products => { this.products = products; console.log(this.products); })

  }

  ngAfterViewInit() {

    setTimeout(() => {
      map = new google.maps.Map(document.getElementById('map'), {
        center: myLatLng,
        zoom: 12
      });

      var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        title: 'Hello World!'
      });

      markers.push(marker);
      console.log(map)

    }, 3000);
  }

  showMarker(latitude, longitude) {
    for (var i = 0; i < markers.length; i++) {
      markers[i].setMap(map);
    }
    // TS convert string to Int using +
    var clickedLocation = { lat: +latitude, lng: +longitude }
    console.log(clickedLocation);

    map.panTo(clickedLocation);

    var marker = new google.maps.Marker({
      position: clickedLocation,
      map: map,
      title: 'Hello World!'
    });
  }
}

现在我应该把这段代码放在哪里?

     google.maps.event.addListener(marker, 'click', () => {
    console.log('hei');
  });

你可以写这段代码

google.maps.event.addListener(marker, 'click', () => {
    console.log('hei');
});

之后直接

var marker = new google.maps.Marker({...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM