首页 / JAVASCRIPT / javascript-Angular 2和LeafLet Uncaught ReferenceError：在HTMLButtonElement.onclick中未定义

javascript-Angular 2和LeafLet Uncaught ReferenceError：在HTMLButtonElement.onclick中未定义

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了javascript-Angular 2和LeafLet Uncaught ReferenceError：在HTMLButtonElement.onclick中未定义，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1532字，纯文字阅读大概需要3分钟。

内容图文

我在Angular 2中有一个使用Leaflet的项目,我想通过单击按钮来调用简单函数,但是我得到了

ReferenceError: <function> is not defined at HTMLButtonElement.onclick

这是我的代码.一切正常,但功能无效.

export class MapComponent implements OnInit {

//layer
  googleStreets = L.tileLayer('http://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}',{
    maxZoom: 30,
    subdomains:['mt0','mt1','mt2','mt3']
  });
//!!!The FUNCTION
  test() {
    console.log('test');
  }
constructor () {}

ngOnInit() {
  this.ParseService.getJ().subscribe(data => {
    this.myData = JSON.parse(data);

//set markers and popUps
for(let i = 0; i < this.myData.length; i++) {
  let lat =+((this.myData[i])['lat']);
  let lng =+((this.myData[i])['lng']);
  this.id = (this.myData[i])['code'];

//HERE IS THE PROBLEM. BUTTON APPEARS BUT FUNCTION IS NOT AVAILABLE 
      let popUp = (this.myData[i])['displayName'] +
        '<br/><button onclick="test">Raumplan</button>';

  let markerLocation = L.latLng(lat, lng);
  let marker =  new L.Marker(markerLocation, {icon: customIcon});
  map.addLayer(marker);
  marker.bindPopup(popUp);
}
  });

您能帮我解决问题吗？

解决方法:

不要使用onclick,因为它是HTML,并且您分配给onclick的函数将在< script>中的javascript i-e的全局范围内进行搜索.标签,这不再是Angular2的一部分.所以您应该尝试的是下面的内容

import {Component} from '@angular/core';
@Component({
selector: 'dynamic-button',
template: '<button type="button" (click)="test()">Raumplan</button>'
})

export class DynamicButton{
public test(): void{
alert("Hi. I am a test call");
  }
}

接着

let popUp = (this.myData[i])['displayName'] +
'<br/><dynamic-button></dynamic-button>';

内容总结

以上是互联网集市为您收集整理的javascript-Angular 2和LeafLet Uncaught ReferenceError：在HTMLButtonElement.onclick中未定义全部内容，希望文章能够帮你解决javascript-Angular 2和LeafLet Uncaught ReferenceError：在HTMLButtonElement.onclick中未定义所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/667404.html

来源：【匿名】