CODEWITHSUNDEEP
ember.jsember-router
Andreas Köberle
Andreas Köberle

Reputation: 110932

Query parameter in Ember Route

Is there a way to have query parameter in ember routes. In my app there is a product search route where the user search for products with an input field. When the user navigates to one of the found products and then hit the back button the previous search is gone cause the url of the route is products. So is there a way to store the query the user does into the route like products?search=shirts so the previous result will be displayed when the user comes back to this page?

Upvotes: 3

Views: 1244

Answers (1)

MilkyWayJoe
MilkyWayJoe

Reputation: 9092

Unless I misunderstood what you want or unless I have to because of biz requirements, I wouldn't create a route for specific search category, instead I would create a computed property (or a function with observe) that is filtered by a search keyworkd (as a property of my controller). Something like the following:

App.SomeController = Em.ArrayController.extend({
    searchKeyword: '',
    filteredSearchResults: function() {
        var keyword = this.get('searchKeyword');
        if(keyword.length > 0) {
            // filtered search
            return this.get('content').filter(function(item) {
                // do your own filtering logic here
                return item.get('name').indexOf(keyword) !== -1
            });
        }  else {
            // unfiltered search
            return this.get('content');
        }
    }.property('content', 'searchKeyword');
});

Then in Handlebars I would iterate somewhat like this 

{{#each filteredSearchResults}} 
    ... do stuff here...
{{/each}}

The search text field should be bound to the controller's searchKeyword property, so the search term doesn't get lost when you transition from route to route. The problem with this is that the search term will not get erased unless you explicitly go and clean that property ( you could technically have some logic/checks for specific scenarios in which you manually delete the value of that field/bind);

Upvotes: 0

Related Questions