AngularJS - Google将ui-sref映射到标记内

时间:2021-10-26 20:59:51

Hi I'm having google maps in angular and I'm trying to make custom marker.content with a button to get to another route. I'm setting merkers in service like this

嗨我有角度的谷歌地图,我正在尝试使用按钮进行自定义marker.content到达另一条路线。我正在设置这样的服务人员

this.setMarker = function (item, map) {
    var position = new google.maps.LatLng(item.loc[1], item.loc[0]);
    bounds.extend(position);

    var marker = new google.maps.Marker({
        map: map,
        position: position,
        title: item.name,
        icon: iconBase + 'basic_pin.png'
    });

    marker.content = '<div class="infoWindowContent">' +
    '<div class="author">' + item.user.name + '</div>' +
    '<div class="horizontal">' +
    '<dl>' +
    '<dt>created:</dt>' +
    '<dd class="ng-binding">'  + $filter('dateFormat')(item.created_at)  +'</dd>' +
    '<dt>tracks:</dt>' +
    '<dd class="ng-binding">' + item.tracks.length + '</dd>' +
    '<dt>type:</dt>' +
    '<dd class="ng-binding">' + utilsFactory.getPlaylistType(item.settings.is_private,item.settings.is_yoobox,item.settings.is_locked) + '</dd>' +
    '</dl>' +
    '</div>' +
    '<div class="pink_button enter-play">                ' +
    '<a ui-sref="detailSite({playlistID: item._id})" ng-show="false">play</a>' +
    '</div>'+
    '</div>';

    return marker;
};

The problem is with ui-sref which doesn't work as like other angular directives. Does anyone know the solution for this?

问题在于ui-sref与其他角度指令不同。有谁知道解决方案吗?

1 个解决方案

#1


1  

you have to use $compile service.

你必须使用$ compile服务。

 marker.content = '<div class="infoWindowContent">' +
    '<div class="author">' + item.user.name + '</div>' +
    '<div class="horizontal">' +
    '<dl>' +
    '<dt>created:</dt>' +
    '<dd class="ng-binding">'  + $filter('dateFormat')(item.created_at)  +'</dd>' +
    '<dt>tracks:</dt>' +
    '<dd class="ng-binding">' + item.tracks.length + '</dd>' +
    '<dt>type:</dt>' +
    '<dd class="ng-binding">' + utilsFactory.getPlaylistType(item.settings.is_private,item.settings.is_yoobox,item.settings.is_locked) + '</dd>' +
    '</dl>' +
    '</div>' +
    '<div class="pink_button enter-play">                ' +
    '<a ui-sref="detailSite({playlistID: item._id})" ng-show="false">play</a>' +
    '</div>'+
    '</div>';

    var compiledContent = $compile(marker)($scope);

    return compiledContent[0];

Documentation here $compile

文档在这里$ compile

#1


1  

you have to use $compile service.

你必须使用$ compile服务。

 marker.content = '<div class="infoWindowContent">' +
    '<div class="author">' + item.user.name + '</div>' +
    '<div class="horizontal">' +
    '<dl>' +
    '<dt>created:</dt>' +
    '<dd class="ng-binding">'  + $filter('dateFormat')(item.created_at)  +'</dd>' +
    '<dt>tracks:</dt>' +
    '<dd class="ng-binding">' + item.tracks.length + '</dd>' +
    '<dt>type:</dt>' +
    '<dd class="ng-binding">' + utilsFactory.getPlaylistType(item.settings.is_private,item.settings.is_yoobox,item.settings.is_locked) + '</dd>' +
    '</dl>' +
    '</div>' +
    '<div class="pink_button enter-play">                ' +
    '<a ui-sref="detailSite({playlistID: item._id})" ng-show="false">play</a>' +
    '</div>'+
    '</div>';

    var compiledContent = $compile(marker)($scope);

    return compiledContent[0];

Documentation here $compile

文档在这里$ compile