Grow your CSS skills. Land your dream job.

How to render a template in Ember.js when the URL is manually entered, not clicked through

  • # June 20, 2013 at 12:56 am

    I’m pulling a bunch of json data from an external api app. I have a group model:

    Mdm.Group = Ember.Object.extend()

    Mdm.Group.reopenClass
    all: ->
    Mdm.ajax(
    url: Mdm.apiUrl(‘/groups’)
    ).then (data) ->
    console.log data
    groups = []
    for group in data.response
    groups.addObject(Mdm.Group.create(group))
    console.log(groups)
    groups

    find: (group_id) ->
    Mdm.ajax(
    url: Mdm.apiUrl(“/groups/#{group_id}”)
    ).then (data) ->
    console.log data

    And a GroupsRoute:

    Mdm.GroupsRoute = Ember.Route.extend
    model: ->
    Mdm.Group.all()

    And a GroupRoute:

    Mdm.GroupRoute = Ember.Route.extend
    model: (params) ->
    console.log ‘oh hai’
    Mdm.Group.find(params.group_id)

    It’s a simple ember app, I have a groups template that is listing out all the group objects. When you click an individual group, the group template renders inside the groups template, displaying the name of the group.

    However, when I manually enter a group_id into the url, such as ‘groups/:group_id’, or use the back or forward buttons to change the url, the group template does not render, leaving the area where it should be blank.

    In the console though the app is returning the correct group object when you manually enter a group url, its just not displaying the group template with that group object.

    How can I load the group template to use that group object that I’m getting in the console, the same group object that the url is referencing but not displaying?

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".