Angular - 无法使用Bing Map push pin click重定向到另一个组件

时间:2018-05-06 03:55:25

标签: angular angular-ui-router bing-maps

单击Bing Map Push pin,但在控制台日志中未定义路由器。

因此无法重定向。如果我在构造函数中添加了router.navigate,它就能正常工作。

以下是我的代码

 import { Component,  ViewChild, OnInit } from '@angular/core';
    import { } from "bingmaps/scripts/MicrosoftMaps/Microsoft.Maps.All"
    import {Router,ActivatedRoute} from '@angular/router';

        @Component({
          selector: 'device-map',
          templateUrl: './device-map.component.html'  
        })
         
        export class DeviceMapComponent implements OnInit{
          @ViewChild('myMap') myMap;
          
          constructor(public router: Router,  public route: ActivatedRoute,) {
            console.log(this.router); }

          pushpinClicked(e){
            console.log("I am clicked");
            console.log(this.router);
            this.router.navigate(['/Dashboard'], { queryParams: { deviceId: 
             e.target.metadata.title } }); } 

            ngOnInit(){              
            var map = new Microsoft.Maps.Map(this.myMap.nativeElement, {
                credentials: 'My key', center: new Microsoft.Maps.Location(47.6149, -122.1941)
            });

              var infobox = new Microsoft.Maps.Infobox(map.getCenter(), {
                title: "Microsoft", description: "City Center", visible: false,
            });

            infobox.setMap(map);
            var randomLocation = Microsoft.Maps.TestDataGenerator.getLocations(1, map.getBounds());
            var pin = new Microsoft.Maps.Pushpin(map.getCenter(),  {  title: 'Microsoft' });
            pin.metadata = { title: 'Device 1',  description: 'Pin discription' };
            Microsoft.Maps.Events.addHandler(pin, 'click', this.pushpinClicked);
            map.entities.push(pin);
          } 
        }

1 个答案:

答案 0 :(得分:0)

下面是一种为推针点击添加导航的方法(Bing地图)。 箭头功能是必需的。

var dateInputVal = document.getElementById("yourElementId").value;
var d = new Date(dateInputVal);
var dt = d.getFullYear()+"/";
var m = d.getMonth() + 1;
if(m < 10)
    dt += "0"+m+"/";
else
    dt += m+"/";
var d2 = d.getDate();
if(d2 < 10)
    dt += "0"+d2;
else
    dt += d2;