Getting redirected when refreshed emberjs

My router.js is like this:

// router.js
this.route('cards', function() {
  this.route('all');
  this.route('card', {path: '/:card_id'}, function() {
    this.route('edit');
  });
  this.route('new');
});

Now, suppose, I'm inside this link: /cards/1. When I refresh this page, I go to the route /cards/all.

I'm redirecting to /cards/all from /cards:

// cards.js
beforeModel() {
  this.transitionTo('cards.all');
}

Why am I getting redirected to /cards/all when I refresh in /cards/1?

Repo link: http://ift.tt/1Xv7Dye.