Correct way to transitionToRoute

1

I’m making a live search on ember.js. This is the code

App = Ember.Application.create({});

App.Router.map(function () {
    this.resource("index", {path : "/"});
    this.resource("index", {path : "/:query"});
});

App.Torrents = {
    findByQuery : function (query) {
        var torrents = [];
        if (query) {
            for (var i = 0; i < 5; i++) {
                torrents.push({title : query + i});
            }
        }
        return torrents;
    }
};

App.IndexRoute = Ember.Route.extend({
    model : function (params) {
        return App.Torrents.findByQuery(params.query);
    }
});

App.IndexController = Ember.ArrayController.extend({
    onChangeQuery : function () {
        var query = this.get("query");
        this.transitionToRoute("index", {query  : query});
    }.observes("query")
});

I have a query property binded to an input. When the input change I want to transition to the route passing the new query parameter, but the IndexRoute.model method is not being called.

Here is the example http://jsbin.com/ekaGipO/2/edit?html,js,output

2

I have the answer in stackoverflow