$scope 更改后的角度刷新

Question

在我的应用程序中，我使用谷歌地图 API v3 来在地图上显示信息窗口。信息窗口充满了$scope 值。地图加载后，$scope 因事件发生变化，但我的信息窗口内容还是一样。

如何让它刷新？

我已经尝试在事件回调函数结束时调用$scope.$apply()，但没有成功。

Controller.js

this.fillingMethod = function(){
            info = MyService.getInformation();
            $scope.fillingInfo = info;
}
this.changeAnInfo = function(){
            var info = $scope.fillingInformation;
            var info = MyService.changeInfo(info);
            $scope.fillingInformation = info;
            $scope.$apply();
            }//Google InfoWindow is not refreshed.

View.html

    <!-- ng-controller is defined and refers to Controller -->
    <map id="map-canvas" center="current-location" zoom="15" ng-init="map.fillingMethod()">
        <marker id='test' position="current-location" animation="BOUNCE"></marker>
            <info-window id="marker-info" class="gmarker">
                <div ng-non-bindable="">
                     <div id="siteNotice"></div>
                         <h1 id="firstHeading" class="firstHeading">{{fillingInformation}}</h1>
                     </div>
                </div>
            </info-window>
    </map>
<button ng-click="changeAnInfo()" />

Answer 1

angular-google-maps 看看这个。这是角度的谷歌地图。您将使用自定义指令。只需将您的$scope 放入其中，它就会自动更新，就像您将范围放入html tags 一样。

查看 API，使用 window 指令或 windows

编辑：你的代码中有 2 个奇怪的东西

• 首先，为什么会有ng-non-bindable 它会阻止angular 编译里面的东西。 尝试将其删除？
• 您使用的库看起来不像angular-google-maps 和angular-ui。如果是的话。然后你将有自定义指令/属性。要进行更新，只需将信息放入标签内即可。

<map id="map-canvas" center="current-location" zoom="15" ng-init="map.fillingMethod()">
    <marker id='test' position="current-location" animation="BOUNCE"></marker>
        <info-window id="marker-info" class="gmarker">
            <div >
                 <div id="siteNotice"></div>
                     <h1 id="firstHeading" class="firstHeading">{{fillingInformation[0]}}</h1>
                 </div>
            </div>
        </info-window>
</map>