0

The filter in angular works fine in the tutorial example, but let's say we wanted to add the release date with a date filter instead of the snippet. So the code would look like this:

  <ul class="phones">
    <li ng-repeat="phone in phones | filter:query">
      {{phone.name}}
      <p>{{phone.releaseDate | date:'medium'}}</p>
    </li>
  </ul>

Is there any way I can filter based on the DOM values instead of the underlying data on the phone object? The filtered releaseDate is much easier for users to search than the actual data.

2

2 Answers 2

1

Filters are services with a specific name convention and format.

In angular services are responsible for data & state (and more but rarely used for DOM manipulation)

So filters work on the model data only. Sure you can create your own filter that manipulates the DOM (responsibility of directives in angular) but this wouldn't be the angular way.

So to solve your problem you need to manipulate not the dom but your model data.

I've created a plunker on how I would do this:

http://plnkr.co/edit/uol9GQjUsEIN42JzLIC9?p=preview

4
  • I thought the whole point of using a filter at all was to format data. Now we are pushing the responsibility of the filter into the model. This is the angular way? I thought filters were used in directives or views - at least all of the documentation in the guide seems to point to using filters in the views/directives only.
    – user140550
    Oct 31, 2013 at 14:23
  • You can use filters in services too. Like I said filters are services. I use the date filter in the service to format the date. I could write my own service to format the date. Instead I took the angular date filter and used it. The problem is the imlementation of the search filter. It simply compares the data you provide. So the easiest way I thought was to alter this data. Implementing you own query filter would require more effort to do.
    – bekite
    Oct 31, 2013 at 14:35
  • I like the approach, it works perfectly. Everything that I've read about filters is that they're used in views and I wanted to confirm that using them in controllers or services is still considered the angular way. Thank you bekite.
    – user140550
    Oct 31, 2013 at 14:43
  • Please don't use filters in controllers. Sure you can for small applications. But controllers responsibility is to setup the scope and interact with the view (listen for events from the view,...). Of course only if you want to do it "the angular way".
    – bekite
    Oct 31, 2013 at 14:48
0

thx alot Chandermani for theaching me a new thing and pointing a fatal error by me.

and for you OP, the answer is NO. (after reading a second time i now understand your question)

angular can only "work" on its own data, and after calculating all of its data it renders it and creates the DOM, so although you could always create a filter of directive to query the DOM and set that data to an angular obj, it would be a very wrong workaround.

remember that the whole point of using angular is using the MVC pattern...

3
  • 4
    date is a angular filter. Oct 31, 2013 at 13:46
  • My server returns dates as the number of milliseconds since 1970. I should tell my users that the angular way is to search for the number of milliseconds? What a hostile way to treat my customers.
    – user140550
    Oct 31, 2013 at 14:18
  • i could not understand your comment user140550, is this another Q? Nov 3, 2013 at 9:36

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.