AngularJS:分块迭代器出错

时间:2015-02-04 18:07:34

标签: angularjs

我在浏览器控制台中收到了很多这样的内容:

  分块迭代器中的

错误:TypeError:无法读取属性' x'的   空

我的应用程序目前包含一个位置列表和地图显示,当点击一个位置时,地图会缩放到该纬度。

点击几下后,我开始收到此错误,地图不再响应。

我正在使用angular-google-maps指令,如果这也与答案有关。

我的地图编码如下:

<div ng-controller="MapController as mapCtrl" class="col-sm-8 col-sm-offset-4 col-md-9 col-md-offset-3 main">
                <ui-gmap-google-map center='mapCtrl.map.center' zoom='mapCtrl.map.zoom'>
                    <ui-gmap-markers models="mapCtrl.mapMarkers" coords="'self'" icon="'icon'" options="'options'">
                    </ui-gmap-markers>
                </ui-gmap-google-map>

            </div>

在我的MapController中:

app.controller('MapController', ['$scope', 'LastReportedEventStore', 'MapMarkerService', 'uiGmapGoogleMapApi', function ($scope, LastReportedEventStore, MapMarkerService, uiGmapGoogleMapApi) {

    var self = this;
    //Default to UK overview
    self.map = { center: { latitude: 51.63841, longitude: -0.55494 }, zoom: 7 };

    uiGmapGoogleMapApi.then(function (maps) {
        self.mapMarkers = MapMarkerService.transformResponseData(LastReportedEventStore.lastReportedEvents);

    });

    $scope.$on('zoomtolatlon', function (event, args) {
        self.map = { center: { latitude: args.lat, longitude: args.lon }, zoom: 15 };
    });



} ]);

我的位置列表中有一个单独的控制器,因此当其中一个元素发生单击时,我会通过ng-click函数处理并广播一个事件:

$rootScope.$broadcast('zoomtolatlon', { lat: lat, lon: lon });

任何人都可以了解导致这种情况失败的原因吗?

修改

好的,所以我应该发布更多关于我在这里做的事情的代码。我的服务如下:

app.factory('DataStoreService', function ($rootScope, $location, $http, $timeout, LastReportedEventStore, MapMarkerService) {

    var getLastReportedEventsURL = '/location/GetLastReportedEvents.json?FieldSet=1&modifiedSince=0';

    //TO-DO: Need to think about adding a cachebuster _dc param like we do in ExtJS?

    return {

        //lastReportedEvents: lastReportedEvents,
        getLastReportedEvents: function () {
            $http.get(getLastReportedEventsURL)
                .success(function (data, status, headers, config) {

                    if (data.success) {

                        var result = angular.fromJson(data);
                        getLastReportedEventsURL = 'location' + result.nextURL;
                        LastReportedEventStore.transformResponseData(result.data);
                        if (angular.isDefined(google)) {
                            MapMarkerService.transformResponseData(result.data);
                        }
                        $rootScope.$emit('lastreportedeventsreceived');


                    }
                    else {
                        console.log('getLocationData ERROR!');
                    }
                })
                .error(function (data, status, headers, config) {
                    console.log('getLocationData ERROR!');
                });

        }

    };

});

我的主要模块

var app = angular.module('ppMobi', [])
.run(['DataStoreService', '$timeout', '$rootScope', function (DataStoreService, $timeout, $rootScope) {

    DataStoreService.getLastReportedEvents();

    $rootScope.$on('lastreportedeventsreceived', function (event) {
        $timeout(function () {
            DataStoreService.getLastReportedEvents();
        }, 5000);
    });

}]);

因此,当应用程序被引导时,会立即执行$ http.get(),然后从服务中该请求中的成功处理程序执行,会引发$ rootScope在运行块中处理的事件,如上所述。发生超时并执行新的提取时,我看到了分块迭代器错误

0 个答案:

没有答案