Question

请帮助修复脚本。

我做新闻。数据存储在json文件中。我在Repeat中输出数据项。

HTML：

<input class="filter" type="text" ng-model="searchPhrase" placeholder="Фильтр по заголовку">

<div class="news-list" ng-if="!detailsShow">
<h2 class="md-display-1 ng-binding">список чего-то из json-файла</h2>
<input class="filter" type="text" ng-model="searchPhrase" placeholder="Фильтр по заголовку">

<ul class="news-list-inner">
  <li class="news-item" ng-repeat="(key, val) in news | filter:searchPhrase" ng-click="openDetails(key)">
    <div class="poster" style="background-image: url('{{newsImagesStoragepath}}{{val.poster}}');"></div>
    <div class="title">{{val.title}}</div>
    <div class="description">{{val.description | cutText:100}}</div>
  </li>
</ul>
</div>

角控制器：

function($rootScope, $scope, $timeout, $http) {
$scope.newsImagesStoragepath = '/';
$scope.detailsShow = false;

$scope.getNews = function() {
  $http.get('news.json')
    .then(function successCallback(resp){
      $scope.news = resp.data.values;
    }, function errorCallback(resp) {
      console.log('error', resp);
    });
};

$scope.getNews();
}

JSON（片段）：

{
  "headers": {
    "title":{"title":"Заголовок","type":"text"},
    "description":{"title":"Описание","type":"text"},
    "poster":{"title":"Изображение","type":"file"}
  },
  "values":{
    "id1": {"title":"Lorem ipsum dolor sit.", "poster": "1.jpg", "description": "Lorem ipsum dolor sit amet, re."},
    "id2": {"title":"Sequi alias, cumque at.", "poster": "3.jpg", "description": "Architecto, placeat! C"},

我需要按标题的短语添加过滤器。但控制台显示会出现以下错误消息：

angular.js：13920错误：[filter：notarray]预期的数组但收到了：

Answer 1

angular.js：13920错误：[filter：notarray]预期的数组但收到了：

当过滤器未与阵列一起使用时，会发生此错误。要按对象属性的值过滤对象，您可以创建自己的自定义过滤器。

在您的情况下，您可以像这样创建过滤器：

<强> JS：

.filter('custom', function() {
  return function(input, search) {
    console.log(input, search);
    if (!input) return input;
    if (!search) return input;
    var expected = ('' + search).toLowerCase();
    var result = {};
    angular.forEach(input, function(value, key) {
      console.log(value);
      var actual = ('' + value.title).toLowerCase();
      if (actual.indexOf(expected) !== -1) {
        result[key] = value;
      }
    });
    return result;
  }
});

<强> HTML：

ng-repeat="(key, val) in news |custom:searchPhrase"

此过滤器将根据您的要求按标题过滤。 Plunker Link（我已对您的代码进行了一些更改）

如何过滤对象？

1 个答案: