Search code examples
javascriptmongodbmeteoriron-router

iron router, trying to create a contacts app with a separate page for each contact


I am trying to make it so that each contact has a particular set of values in the collection like a first name, a last name and an email. I want each time a contact is selected from the list for it to link to a second page where all the details for that contact are displayed.

This is the code I have placed at the top of my Contact.js file...

Router.route('/post/:_id', function () {
    this.render('Post', {
  data: function () {
    return Contax.findOne({_id: this.params._id});
  }
  });
});

And this is the event handler for when a particular contact is selected...

Template.aCont.events({
    "click #view": function() {
      Router.go('/post/:' + this._id);
    }
  });

And here is my relevant html

<template name="contDeets">
  <ul class="list-group">
    <li class="list-group-item">{{this.firstName}}, {{this.lastName}}</li>
  </ul>
</template>

<template name="Post">
  {{#contentFor "headerButtonLeft"}}
    {{>ionNavBackButton}}
  {{/contentFor}}
  {{#contentFor "headerTitle"}}
    <h1 class="title">Contacts</h1>
  {{/contentFor}}
  {{#contentFor "headerButtonRight"}}
  <a id="add" class="button button-clear button-positive" href='/add'>Add</a>
  {{/contentFor}}
  {{#ionView}}
    {{#ionContent}}
      <div id="contactList2">
        {{> contDeets}}
      </div>
     {{/ionContent}}
  {{/ionView}}
</template>

What is wrong with my code? It is opening a new page with the correct url however the information it should be displaying...{{this.firstName}}, {{this.lastName}}... isn't there at all except for the comma.


Solution

  • The colon in the route declaration is to mark parameters. When calling the route you must not include it but just provide the value you want for the parameter:

    Template.aCont.events({
        "click #view": function() {
          Router.go('/post/' + this._id);
        }
    });
    

    Everything else looks good.