在引导程序中映射标记和列表

时间:2016-12-01 06:55:42

标签: javascript angularjs twitter-bootstrap google-maps

我的要求是当我点击谷歌地图上的某些标记时,必须在引导程序的列表中更新这些地方。但是,当我点击数组更新但列表未在引导程序中更新。当我使用infowindow时,一切正常。

HTML

<div class="panel-body">
     <ul style="padding-left:0px;">
         <li class="list-group-item list-group-item-info" ng-repeat="x in routesub" style="font-size:smaller;">
             <span class="badge" ng-click="delloc(x)">x</span>
                {{x}}
         </li>
     </ul>
     <button class="btn btn-danger btn-sm" ng-click="subsearch()">SUBSCRIBE</button>
</div>

app.js

google.maps.event.addListener(marker, 'click', (function (marker, i) {
  return function () {

                   // var content1 = "<div><h6><font color='black'>" + locations[i].Name + "</font></h6><input type = 'button' class = 'btn btn-success btn-sm' value = 'Select' ng-click = 'SubLoc();' /></div>";
                    //var content = $compile(content1)($scope);
                    //$scope.infowindow.setContent(content[0]);
                    //$scope.infowindow.open($scope.map, marker);
                    $scope.SubLoc = function () {
                        if ($scope.routesub.indexOf(locations[i].Name) == -1) {
                            $scope.routesub.push(locations[i].Name);
                            $scope.routeidsub1.push(locations[i].LocationId);
                            marker.setIcon(icon_sel);
                           // $scope.infowindow.close();
                        }
                        else {
                            //$scope.infowindow.close();
                        }
                    }
                    $scope.SubLoc();

                }
            })(marker, i));

当我取消注释那些评论的部分并使用信息时,一切都完成了。点击标记后评论,数据存储在$scope.routesub但在html中不可见。帮助我

1 个答案:

答案 0 :(得分:0)

当你离开&#34;角度世界&#34;在你的谷歌事件监听器中你有角度告诉它必须开始一个摘要周期来刷新它的界限值。

将您要更新的值包装到$apply函数中,如下所示:

$scope.$apply(function(){
    $scope.routesub.push(locations[i].Name);
});

或者您也可以使用$timeout(我的首选方式),因为它不会产生已经运行的&#34;摘要&#34;错误:

$timeout(function(){
    $scope.routesub.push(locations[i].Name);
});