[javascript] AngularJS에서 객체 속성으로 필터링하는 방법

Program / 글쓴이

AngularJS에서 특정 속성 값으로 객체 목록을 필터링하는 사용자 정의 필터를 만들려고합니다. 이 경우 “polarity”속성 ( “Positive”, “Neutral”, “Negative”의 값)으로 필터링하고 싶습니다.

필터가없는 작업 코드는 다음과 같습니다.

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>

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: "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"}}

내가 얻을 수있는 가장 좋은 필터는 다음과 같습니다.

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;
};
});

이 메소드는 빈 배열을 리턴합니다. “console.log (polarity)”문에는 아무것도 인쇄되지 않습니다. “polarity”의 객체 속성에 액세스하기 위해 올바른 매개 변수를 삽입하지 않은 것 같습니다.

어떤 아이디어? 귀하의 답변에 크게 감사드립니다.

답변

filter필터 를 사용하기 만하면됩니다 ( 문서 참조 ).

<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

답변

문서는 완전한 해답을 가지고있다. 어쨌든 이것이 수행되는 방법입니다.

<input type="text" ng-model="filterValue">
<li ng-repeat="i in data | filter:{age:filterValue}:true"> {{i | json }}</li>

만 걸러 age에 data배열과 true정확히 일치합니다.

딥 필터링의 경우 

<li ng-repeat="i in data | filter:{$:filterValue}:true"> {{i}}</li>

는 $깊은 필터에 대한 특별한 속성입니다과는 true위와 같이 정확히 일치하는 것입니다.

답변

더 역동적으로 만들 수도 있습니다.

<input name="filterByPolarity" data-ng-model="text.polarity"/>

그러면 ng-repeat는 다음과 같이 보일 것입니다.

<div class="tweet" data-ng-repeat="tweet in tweets | filter:text"></div>

이 필터는 물론 극성별로 필터링하는 데만 사용됩니다

답변

우리는 아래와 같이 컬렉션을 가지고 있습니다 :

여기에 이미지 설명을 입력하십시오

통사론: 

{{(Collection/array/list | filter:{Value : (object value)})[0].KeyName}}

예: 

{{(Collectionstatus | filter:{Value:dt.Status})[0].KeyName}}

-또는-

통사론: 

ng-bind="(input | filter)"

예: 

ng-bind="(Collectionstatus | filter:{Value:dt.Status})[0].KeyName"

답변

당신은 이것을 시도 할 수 있습니다. 나를 위해 일하는 ‘이름’ 은 arr의 자산입니다.

repeat="item in (tagWordOptions | filter:{ name: $select.search } ) track by $index

답변