ng-repeat在UI-gmaps-window内不渲染来自$http调用的数据

ng-repeat inside ui-gmaps-window not rendering data from $http call

本文关键字：http 调用 数据 UI-gmaps-window ng-repeat      更新时间：2023-09-26

我正在使用angular-ui-gmaps。

我有一个 ng-repeat，它在$http请求后不会呈现 html。 

<ui-gmap-window id="info_window" show="show" coords="position" options="infoWindowOptions">
     <ui-gmaps-window>
         <ul>
              <li ng-repeat="item in items">...</li>
         </ul>
     </ui-gmaps-window>
</ui-gmaps-window>

下面是触发窗口打开的事件，该事件有效。 

    $scope.markerEvents = {
        "click": function (e) {
            $scope.selected = _.first(_.where($scope.items, { "id": e.model.id }));
            $scope.map.center = {
                "longitude": $scope.selected.longitude,
                "latitude": $scope.selected.latitude
            };
            $scope.position = {
                "longitude": $scope.selected.longitude,
                "latitude": $scope.selected.latitude
            };
            ItemService.feedback($scope.selected.id).then(function (response) {
                $scope.items= [1, 2, 3]; //Dummy data, just to show result isn't empty.
                //Show the window
                $scope.show = !$scope.show;
            });
        }
    };

所以是的，我猜信息窗口内容是在$http请求返回之前呈现的。

有人知道解决方案吗？

干杯

确保在

呈现视图之前将$scope.show初始化为 false，然后在加载数据时将其显式设置为 true。

$scope.show = false;
$scope.markerEvents = {
    "click": function (e) {
            ....
            ItemService.feedback($scope.selected.id).then(function (response) {
                 ....
                 $scope.show = true;
            });
        });
    }
};

我不知道<ui-gmap-window>是什么，但它可能无法处理 DOM 中的动态更改。因此，请将其包装在ng-if中，以确保仅在加载数据时创建它。

<div ng-if="show">
    <ui-gmap-window id="info_window" coords="position" options="infoWindowOptions">
        <ui-gmaps-window>
           <ul>
               <li ng-repeat="item in items">...</li>
            </ul>
        </ui-gmaps-window>
    </ui-gmaps-window>
</div>
相关文章：