在浏览器URL中反映更改的选择

Question

如果选择更改，则以下控制器会更新表。这样可行。但是后退按钮返回到最后一个路径而不是最后一个路径（在这种情况下是预期的行为）。

但我更喜欢后退按钮让我回到最后一个选择。到目前为止，我已尝试创建一个新路由并从selectionChanged调用transitionTo并将this.selection.name设置为新路由。但那不起作用（不能调用未定义的方法'transitionTo'）。

所以问题是：在浏览器位置反映选择更改的推荐方法是什么？

NewApp.GridController = Em.Controller.extend({
    content: [],      // bound to Ember.Select view  
    selection: null,  // bound to Ember.Select view
    tableContent: [],

    selectionChanged: function () {
        var that = this;
        if (this.selection) {
            $.getJSON("api/v1/lists/" + this.selection.name + "/prices", function (content) {
                that.set('tableContent', content);
                NewApp.router.root.prototype.switchRoute();
            });
        }
    }.observes('selection'),

    initController: function () {
        var that = this;
        $.getJSON("api/v1/lists/all", function (content) {
            that.set('content', content);
            that.set('selection', content.get(0));
        });
    }

});

路由器看起来像这样：

NewApp.Router = Ember.Router.extend({
  enableLogging: true,
  location: 'hash',

  root: Em.Route.extend({

    show3: Ember.Route.transitionTo('root.third'),

    switchRoute: Ember.Route.transitionTo('root.listname'),

    index: Em.Route.extend({
      route: '/',
      redirectsTo: 'main'
    }),

    main: Em.Route.extend({

      route: 'app',

      connectOutlets: function (router, context) {
        router.get('helloController').initController();
        return router.get('applicationController').connectOutlet({
          name: 'hello'
        });

      }

    }),

    third: Em.Route.extend({

      route: 'third',

      connectOutlets: function (router, context) {
        router.get('gridController').initController();
        return router.get('applicationController').connectOutlet({
          name: 'grid'
        });

      }

    }),

    listname: Em.Route.extend({
      route: 'routeName' // static, just for testing
    })

  })

});