有角度的谷歌地图搜索框 - 没有从$ route.current控制器调用places_changed

时间:2015-06-20 12:04:25

标签: angularjs google-maps angular-google-maps

我遇到了角度谷歌地图和搜索框的问题。 即使ng-view onLoad按预期工作,在搜索框中输入后,也不会从正确的控制器调用places_changed回调,而是仅从$ routeProvider中定义的第一个(和默认值)调用。

您可以在下面找到更多详细信息:

模板的一部分:

<div ng-controller="map">
    <div>
        <script type="text/ng-template" id="searchbox.tpl.html">
            <input type="text" placeholder="Search Place..." class="google-maps-search">
        </script>

        <ui-gmap-google-map center='map.center' events="map.events"  options="map.options" zoom='map.zoom'>
            <ui-gmap-search-box template="map.searchbox.template" events="map.searchbox.events" position="BOTTOM_RIGHT"></ui-gmap-search-box>
            <ui-gmap-marker coords="map.marker.coords" options="map.marker.options" events="map.marker.events" idkey="map.marker.id"></ui-gmap-marker>
            <ui-gmap-markers models="mapMarkers" coords="'self'" icon="'icon'">
                <ui-gmap-windows show="show">
                    <div ng-non-bindable>{{title}}</div>
                </ui-gmap-windows>
            </ui-gmap-markers>
        </ui-gmap-google-map>
    </div>

    <div><div ng-view="" onload="renderView()"></div></div>

父控制器的一部分:

app.controller('map', function ($scope, $log, $location) {
    $scope.map = {
        events: {
            click: function(map, eventName, args) {}
        },
        marker:  {
            id: 0,
            coords: {
                latitude: $scope.lat,
                longitude: $scope.lng
            },
            options: { draggable: true }
        },
        searchbox: {
            template: 'searchbox.tpl.html',
            events: {
                places_changed: function (searchBox) {}
            }
        }
    };
});

以下每个子控制器(在$ routeProvider中定义):

$scope.map.searchbox.events.places_changed = function (searchBox) {
    var place = searchBox.getPlaces();
    if (!place || place == 'undefined' || place.length == 0) {
        console.log('no place data :(');
        return;
    }

    $scope.lat = place[0].geometry.location.lat();
    $scope.lng = place[0].geometry.location.lng();
    $scope.map.center = {
        "latitude": $scope.lat,
        "longitude": $scope.lng
    };


    $scope.renderView();
};

你有什么想法吗?

0 个答案:

没有答案