Cannot resolve `IRouterContext` for `router-lite`?

Help Requests
1

I’m been trying to follow documentation example here on how to use NavigationModel, but can’t get it to work. I use version 2.0.0-beta.20 (latest at the moment).

This is my-app where I would like to inject IRouteContext to pull out navigationModel out of it:

@route({
  title: 'Aurelia v1',
  routes: [
    {
      path: ['', 'home'],
      component: Home,
      title: 'Home',
    },
    {
      path: 'about',
      component: About,
      title: 'About',
    },
    {
      path: 'notfound',
      component: NotFound,
      title: 'Not found',
      nav: false,       // <-- exclude from navigation model
    },
})
@inject(IRouteContext)
export class MyApp {
  private readonly navModel:INavigationModel;

  constructor(routerContext: IRouteContext){
    this.navModel = routerContext.navigationModel;
  }

  public async bind(){
    await this.navModel.resolve();
  }
}

I even explicitly set true to useNavigationModel property in main.ts:

import Aurelia from 'aurelia';
import { RouterConfiguration } from '@aurelia/router-lite';
import { MyApp } from './my-app';

Aurelia
  .register(RouterConfiguration.customize({ useNavigationModel: true }))
  .app(MyApp)
  .start();

However, I am getting an error:

Error: AUR0009: Attempted to jitRegister something that is not a constructor: 'InterfaceSymbol<IRouteContext>'. Did you forget to register this resource?
    at createMappedError (index.dev.mjs:155:49)
    at Container._jitRegister (index.dev.mjs:1226:19)
    at Container.get (index.dev.mjs:1064:41)
    at eval (index.dev.mjs:1125:68)
    at Array.map (<anonymous>)
    at Container.invoke (index.dev.mjs:1125:54)
    at eval (index.dev.mjs:6824:37)
    at onResolve (index.dev.mjs:506:12)
    at new AppRoot (index.dev.mjs:6810:90)
    at Aurelia.app (index.dev.mjs:6942:21)

Am I missing something or doing something wrong here?

2

Hi @nenadvicentic, due to the timing when IRouteContextis registered, as of now it cannot be injected to the app root in constructor. You can however perform a lazy injection.

private rcFactory = resolve(lazy(IRouteContext));

public binding() {
  console.log(this.rcFactory().navigationModel);
}

Example: router-lite - navigation-model (forked) - StackBlitz

I will try to push changes to enable the ctor injection of IRouteContext in app root. Thanks for reporting this.

2 Likes
3

I just revisited the router-lite code. Unfortunately, it needs to stay as it is. However, I have updated the docs for this: docs(router-lite): route-context injection in app-root by Sayan751 · Pull Request #2016 · aurelia/aurelia · GitHub

2 Likes