How to fix FlowRouter.getParam from being 'undefined'

Question

I am adding a new page to a website, and I am copying the code that already exists and is currently working in the website. Why is the FlowRouter.getParam coming up undefined when it works everywhere else?

client/JobInvoice.js

import { Invoices } from '../../../imports/api/Invoice/Invoice';

Template.InvoicePage.onCreated(function(){
  const user = FlowRouter.getParam('_id'); 
  console.log(user);

  this.subscribe('invoices', user);
});

lib/router.js

Accounts.onLogout(function(){
    FlowRouter.go('home');
});

FlowRouter.notFound = {
    action: function() {
        FlowRouter.go('/404');
}
};
const loggedIn = FlowRouter.group({
    prefix: '/secure'
});

loggedIn.route( '/invoice', {
    name: 'invoice',
    action() {
        BlazeLayout.render('FullWithHeader', {main: 
'InvoicePage'});
    }
});

What am I missing?

Answer 1

FlowRouter allows you to define routes with dynamic attributes (path-to-regexp), which are often representing document ids or other dynamic attributes.

For example

FlowRouter.route('/invoice/:docId', { ... })

would define a route that matches a pattern like /invoice/9a23bf3uiui3big and you usually use it to render templates for single documents.

Now if you want to access the document id as param docId inside the corresponding Template you would use FlowRouter.getParam('docId') and it would return for the above route 9a23bf3uiui3big.

Since your route definitions lacks a dynamic property, there is no param to be received by FlowRouter.getParam.

A possible fix would be

loggedIn.route( '/invoice/:_id', {
    name: 'invoice',
    action() {
        BlazeLayout.render('FullWithHeader', {main: 
'InvoicePage'});
    }
});

to access it the same way you do for the other templates.

Readings

https://github.com/kadirahq/flow-router#flowroutergetparamparamname

Answer 2

Here is what I ended up doing and it works.

loggedIn.route( '/invoice/:id', {
name: 'invoice',
action() {
    BlazeLayout.render('FullWithHeader', {main: 'InvoicePage'});
}
});