如何在angularJS中按对象属性过滤 [英] How to filter by object property in angularJS

查看:31
本文介绍了如何在angularJS中按对象属性过滤的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试在 AngularJS 中创建一个自定义过滤器,它将通过特定属性的值过滤对象列表.在这种情况下,我想按极性"属性(正"、中性"、负"的可能值)进行过滤.

这是我没有过滤器的工作代码:

HTML:

<h2 id="totalTitle"></h2><div>{{tweets.length}}</div><div id="totalPos">{{tweets.length|posFilter}}</div><div id="totalNeut">{{tweets.length|neutFilter}}</div><div id="totalNeg">{{tweets.length|negFilter}}</div>

这里是 JSON 格式的$scope.tweets"数组:

{{created_at: "Date", text: "tweet text", user:{name: "user name", screen_name: "user screen name", profile_image_url: "profile pic"}, retweet_count: "转推计数",极性:正"},{created_at: "Date", text: "tweet text", user:{name: "user name", screen_name: "user screen name", profile_image_url: "profile pic"}, retweet_count: "转发次数", 极性: "积极的"},{created_at: "Date", text: "tweet text", user:{name: "user name", screen_name: "user screen name", profile_image_url: "profile pic"}, retweet_count: "转发次数", 极性: "积极的"}}

我能想到的最佳过滤器如下:

myAppModule.filter('posFilter', function(){返回函数(推文){无极性;var posFilterArray = [];angular.forEach(推文,功能(推文){极性 = tweet.polarity;控制台日志(极性);如果(极性==='正'){posFilterArray.push(tweet);}//console.log(极性);});返回 posFilterArray;};});

此方法返回一个空数组.console.log(polarity)"语句没有打印任何内容.似乎我没有插入正确的参数来访问极性"的对象属性.

有什么想法吗?非常感谢您的回复.

解决方案

您只需使用 filter 过滤器(请参阅 文档) :

{{(tweets | filter:{polarity:'Positive'}).length}}</div><div id="totalNeut">{{(tweets | filter:{polarity:'Neutral'}).length}}</div><div id="totalNeg">{{(tweets | filter:{polarity:'Negative'}).length}}</div>

小提琴

I am trying to create a custom filter in AngularJS that will filter a list of objects by the values of a specific property. In this case, I want to filter by the "polarity" property(possible values of "Positive", "Neutral", "Negative").

Here is my working code without the filter:

HTML:

<div class="total">
    <h2 id="totalTitle"></h2>
    <div>{{tweets.length}}</div>
    <div id="totalPos">{{tweets.length|posFilter}}</div>
    <div id="totalNeut">{{tweets.length|neutFilter}}</div>
    <div id="totalNeg">{{tweets.length|negFilter}}</div>
</div>

Here is the "$scope.tweets" array in JSON format:

{{created_at: "Date", text: "tweet text", user:{name: "user name", screen_name: "user       screen name", profile_image_url: "profile pic"}, retweet_count: "retweet count", polarity: "Positive"},
 {created_at: "Date", text: "tweet text", user:{name: "user name", screen_name: "user screen name", profile_image_url: "profile pic"}, retweet_count: "retweet count", polarity: "Positive"},
 {created_at: "Date", text: "tweet text", user:{name: "user name", screen_name: "user screen name", profile_image_url: "profile pic"}, retweet_count: "retweet count", polarity: "Positive"}}

The best filter I could come up with as follows:

myAppModule.filter('posFilter', function(){
return function(tweets){
    var polarity;
    var posFilterArray = [];
    angular.forEach(tweets, function(tweet){
        polarity = tweet.polarity;
        console.log(polarity);
        if(polarity==='Positive'){
              posFilterArray.push(tweet);
        }
        //console.log(polarity);
    });
    return posFilterArray;
};
});

This method returns an empty array. And nothing is printed from the "console.log(polarity)" statement. It seems like I am not inserting the correct parameters to access the object property of "polarity."

Any ideas? Your response is greatly appreciated.

解决方案

You simply have to use the filter filter (see the documentation) :

<div id="totalPos">{{(tweets | filter:{polarity:'Positive'}).length}}</div>
<div id="totalNeut">{{(tweets | filter:{polarity:'Neutral'}).length}}</div>
<div id="totalNeg">{{(tweets | filter:{polarity:'Negative'}).length}}</div>

Fiddle

这篇关于如何在angularJS中按对象属性过滤的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆