Angular JS filter not equals

JavascriptAngularjsAngularjs Ng-RepeatNg Filter

Javascript Problem Overview


Seems like a very basic question but I can't get the syntax right..

<li class="list-group-item" ng-repeat="question in newSection.Questions | filter:Id != '-1'; " ng-mouseenter="hover = true" ng-mouseleave="hover = false">
    <div href="#" editable-text="question.Text">{{question.Text}}</div>
</li>

All I want is to show all the questions where id is NOT -1. What am I doing wrong. Thanks!

Javascript Solutions


Solution 1 - Javascript

The syntax is just a little off, try:

<li class="list-group-item"
    ng-repeat="question in newSection.Questions | filter:{ Id: '!-1'}"
    ng-mouseenter="hover = true" ng-mouseleave="hover = false">
    
    <div href="#" editable-text="question.Text">{{question.Text}}</div>
</li>

See a little JSFiddle: http://jsfiddle.net/U3pVM/3845/

Edit:

Example with variables:

<script> var invalidId = '-1'; </script>
<li class="list-group-item"
    ng-repeat="question in newSection.Questions | filter:{ Id: '!' + invalidId}"
    ng-mouseenter="hover = true" ng-mouseleave="hover = false">
    
    <div href="#" editable-text="question.Text">{{question.Text}}</div>
</li>

Solution 2 - Javascript

Although @Michael Rose answer works for this case, i don't think it will if you try to filter not equal some object/variable

In that case you could use:

JS:

filterId = -1

HTML:

<li ng-repeat="question in newSection.Questions | filter: !{ Id: filterId}">
</li>

An even more nested case:

JS:

someQuestion = {
   someObject: {
     Id: 1
   }
}
newSection.Questions = [someQuestion]

HTML

<li ng-repeat="question in newSection.Questions | filter: !{someObject : {Id: -1} }">
</li>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionamericanslonView Question on Stackoverflow
Solution 1 - JavascriptMichael RoseView Answer on Stackoverflow
Solution 2 - JavascriptFernando CarvalhosaView Answer on Stackoverflow