在單擊按鈕時過濾ng-repeat

我有一個Json，它獲取$ scope.notifications。在單擊按鈕時過濾ng-repeat

**Json** 
0:{ 
    $$hashKey: "object:31" 
    action: "wrote a comment" 
    creationDate: "2015-11-23 13:48:55.0" 
    post: Object 
    seen: true 
    user: Object 
    }

這個Json有一個關鍵：看到哪個可以是真或假。我必須在ng-repeat中過濾出這些對象，其關鍵字爲：在點擊按鈕未讀通知時看過= = false。

然後再次單擊清除篩選器所有通知按鈕。

HTML

<div class="col-xs-12 col-sm-6 col-md-8"> 
    <ul class="notifications-action-menu text-center"> 
     <li> 
      <button type="button" class="btn btn-link btnUnreadFilter active" data-filter="all" id="btnShowAll">All Notifications</button> 
     </li> 
     <li> 
      <button type="button" class="btn btn-link btnUnreadFilter" data-filter="unread" id="btnShowOnlyUnread" ng-click="actions.unreadNotifications()">Unread Notifications</button> 
     </li> 
     <ul></ul> 
     </ul> 
</div> 
<div class="col-xs-12"> 
<div id="notificationsListWrapper" ng-repeat="notification in notifications" ng-hide="{{notification.seen == seen}}"> 
    <div class="notification-item" ng-class="{'read' : notification.seen == true}"> 
     <div class=" no-click-bind mark-as-read-btn"> 
      <button type="button" class="no-click-bind" data-toggle="tooltip" data-placement="top" data-original-title="Mark as read" ng-click="actions.redirectToPost(notification.post.uuid, $index)"> 
      <i class="fa fa-check"></i> 
      </button> 
     </div> 
     <div class="notification-body"> 
      <div class="notification-details"> 
       <a href="" class="doc-profile-img"><img class="" alt="{{notification.user.authorName}}" ng-src="{{(notification.user.thumbnailUrl) ? notification.user.thumbnailUrl :'/assets/images/avatars/avatar_100x100.png'}}"> 
       </a> 
       <a>{{notification.user.authorName}}</a><span class="notification-action"> {{notification.action}}</span> 
       <a href="/news/abcd" class="notification-url no-click-bind">{{notification.post.title}} 
       </a> 
       <div class="notification-meta"><i class="fa notification-type-icon fa-calendar"></i> <small class="notification-datetime text-muted" title="Thursday, January 21, 2016 at 5:26 pm">Jan 21 2016</small> 
       </div> 
       <div class="notification-actions"></div> 
      </div> 
     </div> 
     <div ng-if="notification.post.featuredAttachmentUrl != '' " class="notification-url-img"><img alt="" ng-src="{{notification.post.featuredAttachmentUrl}}"></div> 
    </div> 
</div>

來源

2016-02-13 atul mishra

...和？這裏的問題到底是什麼？ – Ageonix

對不起，編輯不正確 –

試着這麼做：

ng-repeat="notification in notifications | filter:seenFilter"

其中seenFilter設置爲{看出：真正}，{看到：假}或真由控制器。例如：

$scope.actions.unreadNotifications = function(){ 
    $scope.seenFilter = {seen:false} 
}

來源

2016-02-13 17:08:37 Thierry

請單擊未讀通知按鈕時解釋控制器 –

我編輯了我的答案。 – Thierry

感謝您的幫助 –

在單擊按鈕時過濾ng-repeat

回答

相關問題