AngularJS $watch -无限循环
AngularJS $watch - infinite loop
我有两个日期-开始和结束。我想验证(并重新保证)开始<结束。我使用$watch得到了它们变化的通知,然后我去更改它们以确保满足条件,但随后它再次触发$watch,然后我得到$digest达到的最大迭代数,然后事情就出错了。>
所以我的问题是-我如何改变在$watch
内部监视的变量而不引起无限循环。(除了有更多的检查和只有在需要更改时才更改它们)
var TIME_DAY = 1000 * 60 * 60 * 24;
$scope.$watch('timeFilter.startTime', function () {
validateStartEndTime();
},true);
$scope.$watch('timeFilter.endTime', function () {
validateStartEndTime();
},true);
function validateStartEndTime() {
if ($scope.timeFilter.startTime != null && $scope.timeFilter.endTime != null) {
// Remove all seconds
if ($scope.timeFilter.startTime.getSeconds() > 0)
$scope.timeFilter.startTime.setSeconds(0);
if ($scope.timeFilter.endTime.getSeconds() > 0)
$scope.timeFilter.endTime.setSeconds(0);
if ($scope.timeRange.minTime.getSeconds() > 0)
$scope.timeRange.minTime.setSeconds(0);
if ($scope.timeRange.maxTime.getSeconds() > 0)
$scope.timeRange.maxTime.setSeconds(0);
// When start time isn't before end time
if ($scope.timeFilter.startTime >= $scope.timeFilter.endTime) {
// We want to increase end time by 1 minute, if possible - do it. Else - reduce start time by 1 minute
if ($scope.timeFilter.endTime < $scope.timeRange.maxTime) {
$scope.timeFilter.endTime.setMinutes($scope.timeFilter.startTime.getMinutes() + 1);
} else {
$scope.timeFilter.startTime.setMinutes($scope.timeFilter.startTime.getMinutes() - 1);
}
}
// Start time before min time
if ($scope.timeFilter.startTime < $scope.timeRange.minTime) {
$scope.timeFilter.startTime = $scope.timeRange.minTime;
if ($scope.timeFilter.endTime <= $scope.timeFilter.startTime) {
$scope.timeFilter.endTime = $scope.timeFilter.startTime;
$scope.timeFilter.endTime.setMinutes($scope.timeFilter.endTime.getMinutes() + 1);
}
}
// End time after max time
if ($scope.timeFilter.endTime > $scope.timeRange.maxTime) {
$scope.timeFilter.endTime = $scope.timeRange.maxTime;
if ($scope.timeFilter.startTime >= $scope.timeFilter.endTime) {
$scope.timeFilter.startTime = $scope.timeFilter.endTime;
$scope.timeFilter.startTime.setMinutes($scope.timeFilter.startTime.getMinutes() - 1);
}
}
}
}
老实说,我宁愿找到一种方法来避免更改不断被监视的变量。但是,如果你真的想,你可以取消注册你的$watch函数,当你不得不改变你的变量被监视,然后重新注册$watch函数。
要注销$watch函数,您只需要获取引用并在需要时调用。
var myWatch = $scope.$watch('timeFilter.startTime', function () {
validateStartEndTime();
},true);
myWatch(); // It will deregister it.
请记住,有时当您第一次观察一个变量时,它会自动触发该函数。我的建议是总是检查旧的变量是否真的被改变了。
var myWatch = $scope.$watch('timeFilter.startTime', function (newValue, oldValue) {
if(newValue === oldValue){
return;
}
validateStartEndTime();
},true);
我希望它对你有用。遗憾的是,我现在无法测试此代码
我综合了每个人的建议和意见,他们回答了这样的问题:
$scope.$watch('timeFilter.startTime', function(newValue, oldValue) {
if (newValue === oldValue) return;
validateStartEndTime();
}, true);
$scope.$watch('timeFilter.endTime', function(newValue, oldValue) {
if (newValue === oldValue) return;
validateStartEndTime();
}, true);
function validateStartEndTime(startChanged) {
if ($scope.timeFilter.startTime == null || $scope.timeFilter.endTime == null) return;
var tempStart = new Date($scope.timeFilter.startTime), tempEnd = new Date($scope.timeFilter.endTime);
if ($scope.timeRange.minTime && $scope.timeRange.maxTime) {
// Logic start
// Logic ends
if ($scope.timeFilter.startTime !== tempStart)
$scope.timeFilter.startTime = tempStart;
if ($scope.timeFilter.endTime !== tempEnd)
$scope.timeFilter.endTime = tempEnd;
}
}
这样我就可以确保我做的改动越少越好。如果有人有任何建议
相关文章:
- 使用滚动溢出-x进行无限循环
- 从index.html调用函数,该函数无限循环
- 使用jQuery无限循环播放HTML页面幻灯片
- Grunt任务没有加载,获得无限循环
- 如何在不进入无限循环的情况下将网站重定向到Facebook画布URL
- Backbone+RequireJS+Mediator模式导致视图逻辑短路和无限循环
- jQuery无限循环,动画化许多项目
- 如何避免试图用php+jquery显示php起始页的无限循环
- 6502仿真增强型基本无限循环$C000至$E0ED
- Angular ngRoute导致无限循环和堆栈溢出
- Jquery:无限循环和暂停
- 数组数组:无限循环
- MeteorJS使用流星调用和流星方法时的无限循环
- 如何无限循环数据集字符串
- jquery在无限循环中运行
- 遍历对象会导致无限循环
- 为什么内部Javascript循环会阻止外部循环中断(即无限循环)
- 角度编译指令似乎进入了无限循环
- 显示随机数js的无限循环
- AngularJS $watch -无限循环