<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);
};
}
添加了地图的组件类。一些文字。更多文字*
尝试在组件中定义这样的方法,
goToRotterdam() {
const position = {lat: 51.9244201, lng: 4.4777325};
this.gmapWrapper.panTo(position);
}
并且还使用了ConzorsFan提到的(click)
事件。