AngularJS $监视变量并重新评估ng-class表达式

Question

我正在尝试在我的应用程序中实现类似书签的功能，并且必须查看存储所有已添加书签的ID的变量。根据该变量，我必须告诉ng-class重新评估它的函数表达式，以便添加或不添加类bookmarked。

当变量ng-class发生变化时，如何告诉$scope.Bookmarks再次运行？

<a ng-repeat="event in events"
   ng-class="isBookmarked(event.id)"
   class="icon__bookmark"></a>

Answer 1

如果在由angular处理的代码中更改书签ID（例如在控制器，指令，服务，$ http回调等中），那么您根本不需要做任何事情。 Angular会在需要时自动重新评估isBookmarked(event.id)，以确保UI始终是最新的。

如果由于某种原因，更新必须在角度处理的代码之外（例如在外部库中）完成，那么您可以手动强制更新角度。但是，强烈推荐只是确保代码由angular处理。你通常可以这样做，但这取决于具体情况。

如果您需要强行使用，请按以下方式使用$scope.$apply：

$scope.$apply(function() {
  // Write code here to update bookmark ID's
});

Answer 2

假设您要添加一个名为＆＃34的课程;标记为＆＃34;到锚标记，并且ismarkmarked返回一个布尔值，使用它（fiddle）：

<a ng-repeat="event in events" 
   ng-class="{bookmarked: isBookmarked(event.id)}" 
   class="icon__bookmark">{{event.name}}</a>

如果书签数组在控制器内，你不应该调用$ apply，请看我提供的小提琴。

Answer 3

试试$route.reload()。对于仅在加载页面时评估一次的指令（如使用JQuery进行DOM操作的类型），它非常适用。