Javascript Angular.js中的过滤指令

我正在尝试开发一个单一的web应用程序，它是一个博客，显示文章。它们由

ng repeat

指令包含在模板中：

   <div class="post" data-ng-repeat="post in postList ">
        <div class="date">published: {{post.published_at | date:'dd-MM-yyyy, HH:mm'}}</div>
            <a class="btn btn-default" data-ng-click="editPost(post)"><span class="glyphicon glyphicon-pencil"></span></a>
            <a class="btn btn-default" data-ng-click="deletePost(post)"><span class="glyphicon glyphicon-remove"></span></a>
            <h1><a href="">{{post.title}}</a></h1>
            <p>{{post.text}}</p>
        </div>
   </div>      

我是新来的

angular

，我不太清楚这意味着什么。有什么想法吗

整个源代码：

编辑2：问题已部分解决。我添加了以下过滤器功能：

 <div class="post" data-ng-repeat="post in postList | bytitle : filterTerm">

它出现在第7行（带有

posts.length

）

编辑

在我发表评论或编辑之前，我没有看到@grundy的答案，所以应该接受它作为答案，但我想指出两件事：

我首选的方法是使用angular.isDefined/angular.isArray：

angular.module("blog").
  filter('bytitle', function() {
    return function(posts, title) {
      if(angular.isDefined(title) && angular.isArray(posts)) {
        var out = [];
        // Filter logic here, adding matches to the out var.
        var i;
        for(i = 0; i < posts.length; i++){
            if(posts[i].title.indexOf(title) >=0){
              out.push(posts[i]);
            }
        }
        return out;
      } else {
        return posts;
      }
   }
});

angular.module（“blog”）。
过滤器（'bytitle'，函数（）{
返回函数（帖子、标题）{
if（角度定义（标题）和角度排列（职位））{
var out=[]；
//在这里过滤逻辑，将匹配项添加到out变量。
var i；
对于（i=0；i=0）{
向外推（柱[i]）；
}
}
返回；
}否则{
返回岗位；
}
}
});

其次，我只想指出，虽然编写自己的过滤器有时是必要的，当然也是需要掌握的一项技能，但对单个属性进行过滤的最简单方法是使用内置过滤器过滤器，将属性添加到要搜索的模型值中：

<input data-ng-model="filterTerm.title" />
<input data-ng-model="filterTerm.text" /> 

然后在重复过程中，仅使用对象名称添加过滤器，如下所示：

<div class="post" data-ng-repeat="post in postList | filter: filterTerm ">

---

然后，您可以对多个属性使用相同的筛选器。

在您的文件中，使用筛选器代替

angular.module（“blog”），[]）

您需要

angular.module（“blog”）

在第一种情况下，您在第二种情况下创建模块

见：

当传递两个或多个参数时，将创建一个新模块。如果只传递一个参数，则检索现有模块（作为第一个参数传递给模块的名称）

旁注：在plunker中，对js文件的引用是错误的

length属性有错误，因为在通过ajax加载POST之前，您没有初始化此变量，所以在筛选器中未定义传递

您可以修改过滤器，如所示

angular.module("blog").
filter('bytitle', function() {
  return function(posts, title) {
    var out = [];

    //if not pass posts - return empty
    if(!posts) return out;

    //if not pass title, or it empty - return same collection
    if(!title) return posts;

    // Filter logic here, adding matches to the out var.
    var i;
    for (i = 0; i < posts.length; i++) {
      if (posts[i].title.indexOf(title) >= 0) {
        out.push(posts[i]);
      }
    }
    return out;
  }
});

搜寻


在主题中


内容


在标签中

中间





及


发布日期：{发布日期：'dd-MM-yyyy，HH:MM'}
{{post.text}

新职位
标题：


正文：


拯救
清楚的
取消编辑

您能否提供一个Plunkr，以便我可以在上下文中查看控制器、示例模型和视图，以帮助您进行调试？我在你发布的代码中没有看到postController，所以我不知道它的来源。实际上，它可能只是一个非常简单的输入错误，但是你已经定义了你的博客模块两次了！如果查看filters.js文件并删除模块定义的第二个参数空数组，Angular将查找名为blog的现有模块。所以它应该是：angular.module（“blog”）.filter（…或者你当然可以做：app.filter（…是的，上面已经指出了，更正了。如果你能看到我最新编辑中出现的错误，那就太好了；）因此，过滤器被调整为仅在标题被定义时运行，否则它只返回带有过滤器的posts.in文件

angular.module（“blog”），而不是
angular.module（“blog”）。
您需要
angular.module（“blog”）.
。在第一种情况下-您在第二种情况下创建模块-get。请参阅：当传递两个或多个参数时，将创建一个新模块。如果只传递一个参数，则将检索现有模块（作为第一个参数传递给模块的名称）。好的，很公平。但仍有问题，请参阅我的编辑
<input data-ng-model="filterTerm.title" />
<input data-ng-model="filterTerm.text" /> 

<div class="post" data-ng-repeat="post in postList | filter: filterTerm ">

angular.module("blog").
filter('bytitle', function() {
  return function(posts, title) {
    var out = [];

    //if not pass posts - return empty
    if(!posts) return out;

    //if not pass title, or it empty - return same collection
    if(!title) return posts;

    // Filter logic here, adding matches to the out var.
    var i;
    for (i = 0; i < posts.length; i++) {
      if (posts[i].title.indexOf(title) >= 0) {
        out.push(posts[i]);
      }
    }
    return out;
  }
});