Question

我在Angularjs中有一个页面，我正在使用routeProvider来控制页面和它们的URL。（部分）我的routeProvider定义看起来像这样：

$routeProvider.when("/", {
    redirectTo: "/Overview"
}).when("/Overview", {
    controller: "OverviewController",
    templateUrl:"template/overview.html"
}).when("/Group", {
    controller: "GroupController",
    templateUrl:"template/group.html"
});

OverviewController在Google地图上显示每个组的标记，然后GroupController显示所选组中每个用户的标记。

由于用户经常更改其位置或状态，因此GroupController中的数据每隔一分钟就会刷新一次。

dataFactory.getUsers($routeParams.id);
$interval(function(){
    dataFactory.getUsers($routeParams.id);
}, 60*1000);

在这种情况下，getUsers()方法将通过Ajax获取数据，然后调用适当的方法在地图上显示标记。

当您转到/Group页面一次，然后导航回/Overview时，会出现问题。间隔保持执行，概览上的标记将被先前查看的组中的用户的标记覆盖。

我想在$interval调用中的函数中添加一个条件，以检查我们是否在/Group页面上。我如何以Angular的方式做到这一点？（而不是检查window.location.href字符串）

Answer 1

我会走另一个方向。您应该在离开页面时停止间隔，而不是添加条件。

var intervalPromise = $interval(function () { /* ... */ }, 5000);      
$scope.$on('$destroy', function () { $interval.cancel(intervalPromise); });

当你离开控制器时，这会破坏你的计时器。

In angular, how to use cancel an $interval on user events, like page change?

Answer 2

您可以使用$ routeChangeStart来跟踪页面被重定向到其他页面。

$scope.$on('$routeChangeStart', function(next, current) { 
   ... you could cancel your interval here ...
 });

OR

您可以使用以下任意方式跟踪位置变化。

$ locationChangeStart - 在同步位置视图模型和浏览器URL之前触发。 $ locationChangeSuccess - 在位置视图模型和浏览器网址同步后触发。

$scope.$on("$locationChangeSuccess",function(event) {
     ... you could cancel your interval here ...
});

如何查看我所在的页面，或当前页面的控制器？

2 个答案: