根据本地存储中的列表过滤 ng-repeat

Filtering ng-repeat against a list in local storage

本文关键字:列表 过滤 ng-repeat 存储      更新时间:2023-09-26

>I' 将本地存储中的 ID 列表存储为列表,我想在加载 JSON 对象并使用 ng-repeat 循环访问此 JSON 对象中的对象时对其进行过滤。我的想法是任何使用 ng-repeat 显示的项目,如果它们的 ID 在列表中,那么我不想显示它们。

我正在构建一个通知页面,如果消息已被阅读,那么我将通知的 ID 存储在本地存储中,以便我可以跟踪已读取的通知。然后,当我收到带有任何新通知的新 JSON 对象时,我可以检查该 JSON 对象中的哪些通知已被读取,然后不显示它们。

我不太确定如何使用ng-repeat过滤它们,有什么想法吗?

谢谢

斯蒂芬

var myApp = angular.module("myApp", []);
myApp.controller("myController1", function($scope) {
  $scope.hideblocked = function(blockedIds) {
    return function(item) {
      return blockedIds.indexOf(item.id) == -1;
    }
  }
  $scope.blockedIds = [1, 5];
  $scope.items = [{
    "id": 1,
    "name": "a"
  }, {
    "id": 2,
    "name": "b"
  }, {
    "id": 5,
    "name": "c"
  }, {
    "id": 8,
    "name": "d"
  }, {
    "id": 12,
    "name": "e"
  }, {
    "id": 3,
    "name": "f"
  }];
  $scope.blockedIds2 = ["1", "5"];
  $scope.items2 = [{
    "id": "1",
    "name": "a"
  }, {
    "id": "2",
    "name": "b"
  }, {
    "id": "5",
    "name": "c"
  }, {
    "id": "8",
    "name": "d"
  }, {
    "id": "12",
    "name": "e"
  }, {
    "id": "3",
    "name": "f"
  }];
  $scope.block = function(blockedIds, id) {
    if (blockedIds.indexOf(id) == -1) {
      blockedIds.push(id);
    }
  };
});
<div ng-app="myApp" ng-controller="myController1">
  If id is a number :
  <span ng-repeat="item in items| filter:hideblocked(blockedIds)">{{item.name}}</span>
  <button ng-click="block(blockedIds,3)">block f</button>
  <br/>If id is a string:
  <span ng-repeat="item in items2| filter:hideblocked(blockedIds2)">{{item.name}}</span>
  <button ng-click="block(blockedIds2,'3')">block f</button>
</div>
<script src="https://code.angularjs.org/1.3.8/angular.min.js"></script>