Angular

Question

Bing 地图推送 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);
          } 
        }

Answer 1

下面是一种为图钉点击添加导航的方法（Bing 地图）。需要箭头函数。

Microsoft.Maps.Events.addHandler(pin, 'click',  () => {
 this.router.navigateByUrl('/dashboard');});

Angular - 无法使用 Bing 地图推针点击重定向到另一个组件

Angular - Not able to redirect to another component using Bing Map push pin click

angular-ui-router

bing-maps