Ember Route only working on manual refresh

Question

Im pretty new at ember and I want to make Route work with a string instead of id for a prettier url. This Router code here is working when I enter the path manually example.com/#/Commune. But when using {{#linkTo "commune" name}}{{name}}{{/linkTo}} the url is changing correctly but nothing is showing (it does if i refresh the browser). any idea?

JS:

App.Router.map(function() {
    this.route('commune', {path: "/:commune_name"});
});

App.CommuneRoute = Em.Route.extend({
    model: function(params) {
        return App.CommunesController.findProperty('name', params.commune_name);
    }
});

If I do this: it's the other way around. (links working but enter/refresh aint)

App.CommuneRoute = Em.Route.extend({
    model: function(params) {
        return App.Commune.find(params.commune_name);
    }
});

Answer 1

needed to add serialize to my route:

App.CommuneRoute = Em.Route.extend({
    serialize: function(model, params) {
        return {
            name: model._data.attributes.name
        };
    },
    model: function(params) {
        return App.CommunesController.findProperty('name', params.commune_name);
    }
});