2

I implemented the following using latest ember.js (0.9.8.1) by referring to Ember Router not updating url in Chrome and Safari. When I try switch b/w routes via router.transitionTo('route path') method (last 3 lines of the attached snippet), browser url is not updated correctly, but I do see the view markup being updated confirming that state change do happen. Could some help in identifying whether am I missing something here?

BTW: I tested this in Chrome 20.0.1132.27 beta-m

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

App.IndexView = Ember.View.extend({
    template: Ember.Handlebars.compile(
        'hello world from index'
    )
});

App.ShowView = Ember.View.extend({
    template: Ember.Handlebars.compile(
       'hello world from show'
    )
});

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

    root: Ember.State.extend({
        index: Ember.State.extend({
            route: '/',
            redirectsTo: 'tasks'
        }),

        tasks: Ember.State.extend({
            route: '/tasks',

            index: Ember.ViewState.extend({
                route: '/',
                view: App.IndexView
            }),

            show: Ember.ViewState.extend({
                route: '/show',
                view: App.ShowView
            })
        })
    })
});

var router = App.Router.create({});

App.initialize(router);
router.transitionTo('root');
router.transitionTo('root.tasks');
router.transitionTo('root.tasks.show');
Community
  • 1
  • 1
Ram
  • 41
  • 1
  • 4

2 Answers2

2

I ran your code, and in the console, I have the following error "Object hash has no method 'setURL'". By debugging a bit, I found that you have to define the location of the Router with: 

location = Ember.Location.create({ style: 'hash' })

or

location = Ember.Location.create({implementation: 'hash'})

I don't know why exactly, but it seems to work. Perhaps it's only due to ember version.

sly7_7
  • 11,961
  • 3
  • 40
  • 54
0

You are mixing up 2 initialization methods.

  1. When you define App.Router all you need to do is call App.initialize(). It automatically creates an instance of Ember.Router and assigns it to the variable App.stateManager. You can then use App.stateManager to call transitionTo.

  2. You can define the variable router to extend Ember.Router then call App.initialize(router). This method also creates an instance of Ember.router and assigns it to App.stateManager. You can then use App.stateManager to call transitionTo.

Either of the methods will work but I prefer method 1. To manipulate the route we always use App.stateManager.

Gaurav Shetty
  • 461
  • 4
  • 10
  • I tried both the options that you suggested, but looks like App.stateManager is not being initialized i.e., App.stateManager is always undefined. – Ram Jun 08 '12 at 09:07
  • Thats really strange. Can you use [this example](http://jsfiddle.net/justinbrown/C7LrM/10/) as a reference and try it once. – Gaurav Shetty Jun 09 '12 at 02:04
  • Interesting...when I looked at your fiddle on the site it works just fine. When I copy your code it fails with a "Unable to find template "mainApp"" error. I even switched to using latest instead of an explicit 0.9.8.1. Thoughts? – commadelimited Jun 15 '12 at 14:12