Custom filter which uses dictionary obtained from the backend

[migajek]

Hi,

My ngResource returns a list of objects, each of them has a field of type enum. I need to display that field's display-name instead of value, so I had to create custom filter.

The problem is that for the translation I need to use the dictionary returned from the server - also as a Resource.

Should I create separate service for that, which will preload the data on app startup and use it later for displaying? Or is it pointless, since I'm caching the list anyway? 

$resource(...

getStatuses: {method: 'GET', url: '/resource/statuses', isArray: true, cache: true},

...);

how can I use the above FooResource.GetStatuses in a filter? The method returns a promise, can the filter wait for or return the promise somehow?

thanks

[Jens Stegemann]

I am stuck with exactly the same problem. When I try to use the promise returned by the dictionary-service inside the filter I have to return another promise and this leads directly into an infinite loop (like described here).

Unfortunately I have to return a promise since I cannot wait for the http-call to return. Does anybody have an idea. I am quite new to angularjs and suppose that I am missing an important point here...


Thanks,

Jens

[jst]

Sorry, the link I wanted to add is https://groups.google.com/d/msg/angular/-/IxomUg31eiQJ. Here is desribed why returning a (new) promise from a filter leeds to an infinite loop...

[Peter Bacon Darwin]

You should definitely not be calling async services in a filter.  (If that is what you are doing).  Filters get hit - alot - and need to be super slim.

I would have a couple of services that get these things from the server and expose properties that contain the actual values, once they have arrived.  The services will only run the async call when you ask them to (may be only once),

Then your filter can inject these services in and use these properties directly.

Pete

On 8 July 2013 10:56, jst <jwste...@googlemail.com> wrote:

Sorry, the link I wanted to add is https://groups.google.com/d/msg/angular/-/IxomUg31eiQJ. Here is desribed why returning a (new) promise from a filter leeds to an infinite loop...

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[jst]

That is exactly what I am trying to do. The service sends a http-request to optain the dictionary. But since this is async I just get a promise. I do cache this promise inside the service and each time the filter asks for it, the service returns this (most of the time already resolved) promise. But I cannot use this promise inside the filter (as described above). And I am also not able to wait for the http-request to return...

[Peter Bacon Darwin]

Something along these lines?

module.factory('MyService', function($http) {

  var service = {

    results: {};

  };

  $http.get('something').then(function(response) {

    service.results = response.data;

  }); 

  return service;

});

module.filter('MyFilter', function(MyService) {

  return function(value) {

    return MyService.results[value] || value;

  };

});

On 8 July 2013 14:42, jst <jwste...@googlemail.com> wrote:

That is exactly what I am trying to do. The service sends a http-request to optain the dictionary. But since this is async I just get a promise. I do cache this promise inside the service and each time the filter asks for it, the service returns this (most of the time already resolved) promise. But I cannot use this promise inside the filter (as described above). And I am also not able to wait for the http-request to return...

[jst]

First: thank you very much for your very fast reply!

I use the same dictionary object (response of the http-request) to populate the options of a selelect-box. When I handle it the way you suggested, the select-box stays empty since at the time the property is read, it is still undefined... That's the reason why I think I have to return a promise from my service. Then I could satisfy the select-box-options-binding, but not the filter, and vice versa.

[Peter Bacon Darwin]

ng-options in a select box should update if you update the model object.  You will probably have to replace the whole object rather than just changing its properties though

On 8 July 2013 15:18, jst <jwste...@googlemail.com> wrote:

First: thank you very much for your very fast reply!

I use the same dictionary object (response of the http-request) to populate the options of a selelect-box. When I handle it the way you suggested, the select-box stays empty since at the time the property is read, it is still undefined... That's the reason why I think I have to return a promise from my service. Then I could satisfy the select-box-options-binding, but not the filter, and vice versa.