我想用组件路由器构建一个角度应用程序。此应用程序由两种不同的布局组成。一个是登录屏幕，有两个字段，一个按钮，没有别的。另一种是带有标题、侧边栏和内容的主要布局。内容区域根据路线而变化。
这是我的组件树：
这也是一个plnkr：链接
这就是我定义登录和主路由的方式：
/* main.js */
$routeConfig: [
{path: '/login', name: 'Login', component: 'login'},
{path: '/...', name: 'Main', component: 'main', useAsDefault: true}
]
现在，我现在使用的方法有两个主要问题。
首先，使用 ng-link 时，我的 Main 组件中的所有链接都用双斜杠解析。我认为这可能会导致某些浏览器出现问题。
/*this is what i get*/
//crisis-center
/* this is how it should look like*/
/crisis-center
其次，由于我的导航组件不是路由组件，而是一个单独的组件，因此我无法访问 $route。因此，我必须注入 $rootRouter。现在，当我使用它的 isRouteActive 函数时，它总是返回 true。这意味着，我所有的导航链接都将获得活动类。
/* main.js */
this.routeIsActive = function (routerLink) {
/* always returns true */
return $rootRouter.isRouteActive($rootRouter.generate(routerLink));
}