javascript - 从 map 中选择表行。 Angular/Google map 集成

Question

我有一个由 angularJS ng-repeat 制作的表格。当我单击 map 中的标记时，如何以编程方式突出显示(setSelected)我的行之一？这是我的表格:

            <table class="table">
                <thead>
                    <tr>
                        <th>Line ID</th>
                        <th>Type</th>
                        <th>Color</th>
                    </tr>
                </thead>
                <tbody>
                    <tr id="linesList" ng-repeat="line in lines | orderBy: 'line_id'" ng-click="setSelected($event, line.line_id)" ng-class="{selected : line.line_id === line_id}">
                        <td>{{line.line_id}}</td>
                        <td>{{line.line_type}}</td>
                        <td>{{line.line_color}}</td>
                    </tr>
                </tbody>
            </table>    

这是我的代码:http://jsfiddle.net/52hfonsq/

Answer 1

请在此处查看演示 http://jsfiddle.net/7w6gh4we/1/

 google.maps.event.addListener(marker, 'click', function () {
            console.log(marker);


            $scope.safeApply(function () {
            $scope.idSelected = marker.line_id;
        });

            infoWindow.setContent('<h2>' + marker.title + '</h2>' + marker.content);
            infoWindow.open($scope.map, marker);
        });


 $scope.safeApply = function (fn) {
        var phase = this.$root.$$phase;
        if (phase == '$apply' || phase == '$digest') {
            if (fn && (typeof (fn) === 'function')) {
                fn();
            }
        } else {
            this.$apply(fn);
        }
    };