1

I have successfully implemented almost all types of filters in this fiddle:

<div data-ng-app='' data-ng-init="vehicles=[
                   {type:'car',color:'red'},
                   {type:'bike',color:'black'}]">
  <h1>
        AngularJS <a href='http://www.w3schools.com/angular/angular_filters.asp'>
        Filters Example</a>
    </h1>

  <p>Enter text
    <input type='text' data-ng-model='abc' />
  </p>
  <p>The text you entered is
    <br/> <a href='http://www.w3schools.com/angular/tryit.asp?filename=try_ng_filters_uppercase'>Upper case</a> {{ abc | uppercase }}
    <br/><a href='http://www.w3schools.com/angular/tryit.asp?filename=try_ng_filters_lowercase'>Lower case</a> {{ abc | lowercase }}</p>Enter amount
  <input type='number' data-ng-model='num1' />
  <p>The <a href='http://www.w3schools.com/angular/tryit.asp?filename=try_ng_filters_currency'>amount</a> you entered is
    <br/>{{ num1 | currency }}</p> <a href='http://www.w3schools.com/angular/tryit.asp?filename=try_ng_filters_orderby'> Directives Filter example</a>

  <br/>Vehicles filtered by type:
  <ul data-ng-repeat="v in vehicles | orderBy:'type'">
    <li>{{"Vehicle type is "+v.type +" with color "+ v.color}}</li>
  </ul>
  <br/>Vehicles <a href='http://www.w3schools.com/angular/tryit.asp?filename=try_ng_filters_input'>filtered by user input:</a>

  <br/>
  <input type="text" ng-model='test' />
  <ul data-ng-repeat="v in vehicles | filter: 'test' | orderBy:'type'">
    <li>{{"Vehicle type is "+v.type +" with color "+ v.color}}</li>
  </ul>
</div>

Everything is working except input filters.

This is how I'm seeing it now:

no output

Why is the array not printed and filtered by user input?

1 Answer 1

2

Remove the single quotes from 'test' passed to the filter. Since it is not a string, its a model and it should be passed directly to the filter.

<ul data-ng-repeat="v in vehicles | filter: test | orderBy:'type'">
    <li>{{"Vehicle type is "+v.type +" with color "+ v.color}}</li>
</ul>

The above code will work.

Sign up to request clarification or add additional context in comments.

1 Comment

Thanks @VVK - So it clarified me that input filters doesn't require quotations. Something else one need to avoid in such cases please?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.