Фильтр ngRepeat на основе переменной области видимости

Question

У меня есть следующее использование ng-repeat для отображения сообщений в блоге:

data-ng-repeat="post in posts | filter: {category: filterCategory} | limitTo:12 ">

"filterCategory" - это переменная области видимости, которую я изменяю с помощью ng-click для набора элементов списка:

<li class="filter" ng-repeat="post in (posts | unique: 'category._id' )" ng-click="setFilterCategory(post.category._id)">

контролируется следующим:

 $scope.setFilterCategory = function(id) {
        $scope.filterCategory = id;
 }

Проблема заключается в том, что когда пользователь нажимает на один из этих элементов списка и setFilterCategory() изменяет filterCategory в области действия, на мгновение отображаются все сообщения (как если бы фильтров не было), затем фильтр применяется. Я хотел бы избежать этого перехода и перейти прямо от предыдущего фильтра к следующему. Что я могу сделать?

Я предполагаю, что это связано с циклом дайджеста, но я недостаточно опытен, чтобы точно сказать, что я должен изменить, если что-нибудь.

Редактировать № 1:
Я пытался воспроизвести на скрипке ( http://jsfiddle.net/igorauad/w4mkny0e/), но безуспешно. В этой скрипке все работает нормально, а в моем приложении это занимает больше времени. Я не знаю, если это имеет значение, но в моем приложении я загружаю сообщения из ресурса, в то время как в скрипте они статически объявлены.

Answer 1

Попробуйте с этим, если у вас проблема с областью с задержкой.

 $scope.setFilterCategory = function(id) {
      $scope.$apply(function(){
        $scope.filterCategory = id;
      });
 }

если вы все еще видите проблему, вы можете создать plunker или JSfiddle или любой другой