为什么我的函数不在列表中调用? (角落下)

问题描述 投票:0回答:1
<div class="dropdown" dropdown [dropdownToggle]="false" (onOpen)="ewa()" (onClose)="doSomeActionOnClose()">
  <button class="btn btn-primary" dropdown-open>My Heroes</button>
  <ul class="dropdown-menu">
    <li value="Denhaag" onclick="goToDenHaag()"><a>Den haag</a></li>
    <li  value="Amsterdam" onclick="goToAmsterdam()"><a>Amsterdam</a></li>
    <li value="Utrecht" onclick="goToUtrecht()"><a>Utrecht</a></li>
    <li value="Gouda" onclick="goToGouda()"><a>Gouda</a></li>
    <li value="Eindhoven" onclick="goToEindhoven()"><a>Eindhoven</a></li>
    <li value="Rotterdam" onclick="goToRotterdam()"><a>Rotterdam</a></li>
     </ul>
</div>

当我选择该选项时,为什么我的控制台说功能未定义? onclick params中陈述的函数确实存在于我的组件中,如下所示:

public goToRotterdam = () => {

let position = {lat:  51.9244201, lng:  4.4777325};
this.gmapWrapper.panTo(position);
}

未捕获的ReferenceError:未定义goToRotterdam

任何帮助表示赞赏

编辑:

import {Component, OnInit, ViewChild} from "@angular/core";
import { MapsAPILoader } from '@agm/core';
import { Observable, Observer } from 'rxjs';
import {GMapsService} from "./map.service";
import * as data from './inkomen.json';
import * as inbraakdata from '../../assets/output.json';
import * as data_latlon from './inkomen_latlon.json';
import * as inbraak_latlon from './output.json';
import {Http} from "@angular/http";
import 'rxjs/add/operator/map';
import {last} from "@angular/router/src/utils/collection";
import {DropdownModule} from "ngx-dropdown";
import { AgmCoreModule, GoogleMapsAPIWrapper, AgmInfoWindow, AgmDataLayer, CircleManager, AgmCircle } from '@agm/core';
import {$} from "protractor";

@Component({
  selector : 'googlemap',
  templateUrl: 'maps.html',
  styleUrls: ['map.component.css']
})
export class GoogleMapsComponent implements OnInit{
  @ViewChild(GoogleMapsAPIWrapper) private gmapWrapper: GoogleMapsAPIWrapper;
  arr = [];
  arr2 = [];

  jsonLatlon;
map : any;
jsonData;
  result;
  inkomen
  count = 0;
  results: any;
  pages =['abc','bca','pqr'];

  constructor(private http: Http, private mapservice: GMapsService, map: MapsAPILoader) {
  this.jsonData = data;
    this.jsonLatlon = data_latlon
    this.results = inbraak_latlon;
    this.result = inbraak_latlon;


  }

  ngOnInit(){
    console.log(this.jsonData)
    console.log(this.jsonLatlon.data)
    console.log(this.results)
    this.convert()
    let pos1 = {lat: 52.0704978, lng: 4.3006999};
    this.gmapWrapper.setCenter(pos1)
    this.gmapWrapper.setZoom(12);

    }





  title: string = 'My first AGM project';
  //lat: number = 52.1941679;
 // lng: number = 4.6820146;

  public ewa = () => {

    var li = document.getElementById("Denhaag")
    console.log("ewa" +li.innerText);



    alert("ewa");
    let position = {lat: 52.0704978, lng: 4.3006999};
    this.gmapWrapper.panTo(position);
    this.gmapWrapper.setZoom(12);

  };

  public goToDenHaag = () => {
    let position = {lat: 52.0704978, lng: 4.3006999};
    this.gmapWrapper.panTo(position);
  };

  public goToAmsterdam = () => {


    let position = {lat: 52.379189, lng: 4.899431};
    this.gmapWrapper.panTo(position);
  };

  public goToUtrecht = () => {


    let position = {lat: 52.0928768, lng: 5.104480};
    this.gmapWrapper.panTo(position);
  };

  public goToGouda = () => {


    let position = {lat: 52.0115205, lng: 4.7104633};
    this.gmapWrapper.panTo(position);
  };

  public goToEindhoven = () => {


    let position = {lat: 51.441642, lng: 5.4697225};
    this.gmapWrapper.panTo(position);
  };

 goToRotterdam() {
 console.log("We gaan naar Roffa");
    let position = {lat:  51.9244201, lng:  4.4777325};
    this.gmapWrapper.panTo(position);
  };

  public goToAlmere = () => {


    let position = {lat: 52.3507849, lng: 5.2647016};
    this.gmapWrapper.panTo(position);
  };

  public goToGroningen = () => {


    let position = {lat: 53.2193835, lng: 6.5665018};
    this.gmapWrapper.panTo(position);
  };

  public goToNijmegen = () => {



    let position = {lat: 51.8125626, lng: 5.8372264};
    this.gmapWrapper.panTo(position);
  };

}

添加了地图的组件类。一些文字。更多文字*

angular function components dropdown
1个回答
0
投票

尝试在组件中定义这样的方法,

goToRotterdam() {
  const position = {lat:  51.9244201, lng:  4.4777325};
  this.gmapWrapper.panTo(position);
}

并且还使用了ConzorsFan提到的(click)事件。

© www.soinside.com 2019 - 2024. All rights reserved.