CODEWITHSUNDEEP
ember.js
Osman
Osman

Reputation: 1771

Ember.js always loads index route

I have a very simple set up, 2 routes.

1-index 2-classes

My issue is no matter what url I navigate to, the index route is loaded

Here is my js code 

App = Ember.Application.create({
    rootElement: '#ember123'
});
App.ApplicationView = Ember.View.extend({
    initFoundation: function() {
        Ember.$(document).foundation();
    }.on('didInsertElement')
});
App.Router.map(function(){
    this.route('classes', {path:'class'});
    this.route('index', {path:'/'});

});
App.IndexRoute = Ember.Route.extend({
    model: function() {
        return Ember.$.getJSON('url').then(function(classData) {
            return classData;
        });
    }
});

Any my html:

<script type="text/x-handlebars">
    {{outlet}}
</script> 

<script type="text/x-handlebars" id="classes">
    //some html
</script> 

<script type="text/x-handlebars" id="index">
    //some html
</script>

Even if i navigate to "/class" I get the html in index.

Upvotes: 0

Views: 201

Answers (1)

Dhaulagiri
Dhaulagiri

Reputation: 3291

It looks like your application is configured to use the browser's hash to navigate around your site, hence the /#/ that needs to be in the url. You can disable this behavior with this block of code and then /class should work:

App.Router.reopen({
  location: 'auto'
});

This uses AutoLocation to select the best option based on a user's browser.

Upvotes: 1

Related Questions