如何使用 AngularJS 为 InfoBubble 设置动态内容？

Question

我用AngularJS。我想展示一个带有动态内容的 InfoBubble 和 AngularJS 的一些功能，如 ng-click、ng-mouseover。使用 InfoWindows 我必须先编译 html 然后将编译的 html 设置为 InfoWindows 的内容。不幸的是，这不适用于 InfoBubbles。当我添加static html 时没有问题，但是当我添加compiled html 时似乎没有任何内容。

var htmlElement = '<div ng-include="\'/home/include/infoBubble.html\'"></div>'
var compiled = $compile(htmlElement)($scope)
infoWindow = new InfoBubble({
        content: compiled[0],
        shadowStyle: 1,
        padding: 0,
        backgroundColor: 'rgb(57,57,57)',
        borderRadius: 4,
        arrowSize: 10,
        borderWidth: 1,
        borderColor: '#2c2c2c',
        disableAutoPan: true,
        hideCloseButton: true,
        arrowPosition: 30,
        backgroundClassName: 'phoney',
        arrowStyle: 2
    });
 infoWindow.open(vm.map, marker);

Answer 1

问题是我没有最大和最小高度和宽度。设置这些解决了问题。

如何使用 AngularJS 为 InfoBubble 设置动态内容？

How to set dynamic content for InfoBubble using AngularJS?

google-maps-api-3

infowindow

infobubble