在引导模式上显示地图答案

【问题标题】：Show Map on bootstrap modal在引导模式上显示地图
【发布时间】：2017-04-13 21:13:14
【问题描述】：

我想在引导模式上显示一个新的谷歌地图，但它似乎不起作用。请帮忙

$scope.show = function (lat, long) {
        $('#body').append('<div id="map"></div>')
        enter code here$scope.newMap=new google.maps.Map(document.getElementById('map'), {
            zoom: 14,
            center: {lat: 37.77, lng: -122.447},
            mapTypeId:'roadmap'
        });

【问题讨论】：

您确定$('#body') 点位于模态内容节点上吗？而且我认为您必须使用$(modalSelector).on('show.bs.modal' function(){ ... }) 作为侦听器才能听到模态打开事件
我试过了。没用。 $('#myModal').on('show.bs.modal', function(){ $('#body').append('
') $scope. newMap=new google.maps.Map(document.getElementById('map'), { zoom: 14, center: {lat: 37.77, lng: -122.447}, mapTypeId:'roadmap' }); })
我会建议使用 angular-bootstrap 模态。考虑到角度实现：angular-ui.github.io/bootstrap/#/modal

标签： javascript jquery angularjs google-maps google-api

【解决方案1】：

不是我的代码，但这是您想要的工作示例 - plnkr

此示例使用具有指令“map”的模块“ngMap”，有关更多信息，您可以查看ngMap 主页。

【讨论】：