高德地图在angularJS中的InfoWindow动态添加按钮

时间:2022-01-27 00:23:02

前两天遇到一个问题,发现高德地图在angularJS中的InfoWindow动态添加按钮,按钮无效问题。
一开始以为是高德地图开放的权限问题,后来今天有空测试了一下,发现不是这个问题,点击无反应。是什么问题,要么点击函数没有加载,要么是点击事件没有绑定成功,因为angularjs是在第一个加载页面的时候一次性把整个页面生成,所以肯定是动态加载dom没有绑定点击事件成功的问题了,后来发现angularJS的$compile 服务了,他就是在动态添加dom的时候把dom编译好添加,然后编译好了,发现appendChild() 提示不是一个 NODE 类型 后来打印了一下,发现是一个数组类型的,而第一个元素就是我们想要的元素内容,那么就很简单了 ,取数组的第0个元素就好了,点击 弹出asd 成功了。。。angularJS半吊子水平很危险。。

    $scope.asd =function() {
alert("asd")
}
function openInfo() {
//构建信息窗体中显示的内容

var html="<button ng-click='asd()'>asdasd</button>";
var template = angular.element(html);
//编译模板
var Element = $compile(template)($scope);
infoWindow3 = new AMap.InfoWindow({
content: Element[0] //使用默认信息窗体框样式,显示信息内容
});
infoWindow3.open(map, map.getCenter());
}
openInfo();