此代码的目的是在 gmap 上显示标记,但根据日期对它们进行过滤。因此,只会显示在选定时间内创建的标记。
我正在观察来自名为 obj.dateRangeSlider("values") 的外部 js 脚本的值
。
如下所示;
//this will watch the value coming from the time slider and update $scope.filteredMarks accordingly. This could also be expanded to include the search bar.
$scope.$watch(function () {
//function returning the value to watch, aka dates selected
return obj.dateRangeSlider("values");
}, function (newValue, oldValue) {
//function to do when the value changes
$scope.filteredMarks = $filter("filter")($scope.marks, function(value, index){
//filter function to recreate the $scope.filteredMarks with the reduced data
//this is called for each element of $scope.marks
if(value.date >= newValue.min && value.date <= newValue.max){
return true;
}
return false;
});
});
然后在网页上显示如下;
<ui-gmap-google-map center='map.center' zoom='map.zoom' ng-init="lat = 'observation_latitude'">
<ui-gmap-markers models="filteredMarks" coords="'self'" icon="'icon'" fit="true">
</ui-gmap-markers>
</ui-gmap-google-map>
但是我多次收到此错误;
Error: [$rootScope:infdig] http://errors.angularjs.org/1.2.20/$rootScope/infdig?p0=10&p1=%5B%5B%22fn%3…return%20m%3Da%7D%3B%20newVal%3A%20%5B%5D%3B%20oldVal%3A%20%5B%5D%22%5D%5D
at Error (native)
at http://localhost:56499/Scripts/Angular/angular.min.js:6:450
at k.$digest (http://localhost:56499/Scripts/Angular/angular.min.js:110:38)
at k.$apply (http://localhost:56499/Scripts/Angular/angular.min.js:112:173)
at h (http://localhost:56499/Scripts/Angular/angular.min.js:72:454)
at w (http://localhost:56499/Scripts/Angular/angular.min.js:77:347)
at XMLHttpRequest.z.onreadystatechange (http://localhost:56499/Scripts/Angular/angular.min.js:78:420)
从$scope.marks
返回:
> [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, Object]
>
> 0: Object
> date: "2014-11-30T23:21:44.823Z"
> id: 11
> latitude: -27.46009230397052
> longitude: 153.0309266845481
> __proto__: Object
> Object1:
> Object2:
> Object3:
> __proto__: Array[0]
我对造成这种情况的原因感到非常困惑,并且希望得到线索。如果有人认为有帮助,我可以提供更多信息。
干杯肖恩
最佳答案
看来您的错误来自
return obj.dateRangeSlider("values");
不要在 watch 内部运行 obj.dateRangeSlider(),而是将其带到外部,并返回其中保存了对象的变量。更多详情可见here 。 希望这能给您带来一些好主意。
关于javascript - 如何使用 Angular 和 JavaScript 过滤 Gmaps 对象上的标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28208937/