3

私はAngularJS 用の Google マップを使用しており、次の Jade コードがあります。

#map_canvas
  google-map(center='map.center', zoom='map.zoom', draggable='true', options='options', events='map.events')
     marker(coords='marker.coords', options='marker.options', idkey='marker.id')

私のAngularコントローラーには次のものがあります：

$scope.map = {center: {latitude: 42.2405, longitude: -8.7207 }, zoom: 12, events: {
        click: function (map, eventName, args) {
            $scope.marker.coords.latitude = args[0].latLng.lat();
            $scope.marker.coords.longitude = args[0].latLng.lng();
            console.log($scope.marker);
        }
    }
    }

$scope.marker = {
        id: 0,
        coords: {
            latitude: 42.2405, longitude: -8.7207
        },
        options: { draggable: true }
    }

私がしようとしているのは、クリックするたびにマーカーの位置を更新することです。でconsole.log($scope.marker);、マーカーが更新された座標値を出力していることがわかりますが、赤いピンはマップ上で移動しません。

私は自分が間違っていることを理解できません。

編集：

マップのサイズを変更した後、マーカーは新しい場所に移動するため、マーカーの場所が変更されたときにマップが更新されないことが問題であると考えました。これはバグとして報告する必要がありますか? それを解決するために私にできることはありますか？

4

1 に答える 1

3

ついに！$apply() hereとhereを少し読んだ後、次のような解決策を見つけました。

コールバック本体を にラップします$scope.$apply(function () { ... });。イベントは「Angular 以外の」世界からのものであることを忘れないでください。

クリック機能の最後に追加するだけのこの他の投稿を見つけました。$scope.$apply();

この最後の解決策は、私にとって唯一の解決策でした。$apply() について学ぶのは興味深いと思うので、すべてのプロセスを投稿しました。

于 2014-09-10T11:57:01.287 に答える