Javascript 角度传单指令自定义消息html，带有标记弹出窗口中的角度指令。如何？

我想将带有$scope事件处理程序的自定义html标记插入传单标记的message属性。例如：

App.controller('testController', ['$scope', "leafletEvents", '$compile', 'leafletMarkersHelpers',
function($scope, leafletEvents, $compile, leafletMarkersHelpers){

angular.extend($scope, {
    currentLocation : {
        lat: 20,
        lng: 20,
        zoom: 20
    },
    markers: {
    },
    defaults: {
        scrollWheelZoom: true
    },
    events: {
        map: {
            enable: ['zoomstart', 'drag', 'click', 'mousemove', 'popupopen'],
            logic: 'emit'
        },
        markers: {
            enable: leafletEvents.getAvailableMarkerEvents()
        }
    }
});
var html = " <a href=''>info</a><button type='button' ng-click='doSomeAction()'>Choose</button>";
var item = {...}; //some data for marker
            $scope.markers["newMarker"] = {
                lat: item.lat,
                lng: item.lng,
                message: item.message + html,
                draggable: false
            }

App.controller（'testController'、['$scope'、'slapleEvents'、'$compile'、'slapleMarkerHelpers'，
函数（$scope、传单事件、$compile、传单MarkerHelpers）{
角度。扩大范围{
当前位置：{
拉丁美洲：20，
液化天然气：20，
缩放：20
},
标记：{
},
默认值：{
滚轮缩放：真
},
活动：{
地图：{
启用：['zoomstart'，'drag'，'click'，'mousemove'，'popupopen']，
逻辑：“发射”
},
标记：{
启用：FlookEvents.getAvailableMarkerEvents（）
}
}
});
var html=“选择”；
var item={…}；//标记的一些数据
$scope.markers[“newMarker”]={
lat:item.lat，
液化天然气：第1项液化天然气，
message:item.message+html，
可拖动：错误
}

所以doSomeAction（）方法不会触发，因为控制器没有将其绑定到视图。我尝试了下一步操作：

 //this code belongs to the same controller
 //data.leafletEvent.popup._content  html set for popup message before.
 $scope.$on('leafletDirectiveMap.popupopen', function(event, data){
    var html = "<p>" + data.leafletEvent.popup._content + "</p>";
    var template = angular.element(html);
    $compile(html)($scope);
    $scope.$digest();
});
$scope.doSomeAction = function() {
//never fires
   console.log(arguments);
}

//此代码属于同一控制器
//data.FaileEvent.popup.\u之前为弹出消息设置的内容html。
$scope.$on（'shapleDirectiveMap.popupopen'，函数（事件、数据）{
var html=“”+数据.传单事件.弹出窗口.\u内容+”
”；
var template=angular.element（html）；
$compile（html）（$scope）；
$scope.$digest（）；
});
$scope.doSomeAction=函数（）{
//永不开火
log（参数）；
}

---

但它不起作用。因此，如果有人有想法，请随时分享。

您现在可以在弹出消息中轻松使用角度模板：

var html = " <a href=''>info</a><button type='button' 
   ng-click='doSomeAction()'>Choose</button>";

$scope.markers.push({ lat: ..., 
                      lng: ...,
                      message: html,
                      getMessageScope: function() {return $scope; }
                    });

var html=“Choose”；
$scope.markers.push（{lat:。。。，
液化天然气：。。。，
信息：html，
getMessageScope:function（）{return$scope；}
});

不清楚您的代码摘录是否属于指令和/或控制器。请更具体一些。@Bonatoc，更正。我想说的是，除了标记弹出窗口中的按钮在单击时不响应外，其他一切都正常……我不是角度专家，但我认为您在本例中需要的是指令。我添加了n将ext代码添加到FlookeDirectiveMap.popupopen回调，现在它可以按预期工作

var$container=$（data.flookeEvent.popup.\u container）。查找（'.flooke popup content'）；$container.empty（）；var html=“”+data.flookeEvent.popup.\u content+“
”，linkFunction=$compile（angular.element（html）），linkedDOM=linkFunction（$scope）；$container.append（linkedDOM）；

您可以尝试$scope.$apply（函数（）{$compile（html）（$scope）；}）；而不是$scope.$digest（）；这真的很好！我想知道为什么网站上没有示例……但是，在最新版本的插件中，在传递给

push

方法的对象中，

compileMessage

可能也必须设置为

true

。此外，这只适用于标记，而不适用于路径等。