相关疑难解决方法(0)

注意: 这里有许多不同的答案,大多数都是有效的.事实是,当Angular团队改变其路由器时,有效的改变了很多次.最终将成为 Angular路由器的Router 3.0版本打破了许多这些解决方案,但它提供了一个非常简单的解决方案.从RC.3开始,首选的解决方案是使用[routerLinkActive]如本答案中所示.

在Angular应用程序中(当我写这篇文章时,目前在2.0.0-beta.0版本中),您如何确定当前活动路由是什么？

我正在开发一个使用Bootstrap 4的应用程序,我需要一种方法将导航链接/按钮标记为在<router-output>标记中显示其关联组件时处于活动状态.

我意识到,当点击其中一个按钮时,我可以自己维护状态,但这不会涵盖将多条路径放入同一路径的情况(例如主导航菜单以及主要组件中的本地菜单) ).

任何建议或链接将不胜感激.谢谢.

我已经阅读了关于如何确定活动路线的这个问题,但是我还不清楚如何确定一个有参数的活动路线？

现在我这样做:

<a [routerLink]="['/Profile/Feed', {username: username}]"
   [ngClass]="{active: getLinkStyle('/profile/john_doe/feed')}">
   Feed for {{username}}
</a>

在我的组件内:

getLinkStyle(path:string):boolean {
  console.log(this._location.path()); // logs: '/profile/john_doe/feed'
  return this._location.path() === path;
}

这将有效,因为我将用户名作为字符串传递.有没有办法通过传递正确的参数？

我想在我的Angular2应用程序中使用Semantic UI.问题是我找不到更改默认名称"router-link-active"类的路由器设置.我需要它被称为"活动"才能使菜单正确显示.

据我了解,这种设置不存在.我在Vue.JS中看过它,所以我希望它也在那里.请求开发人员解决这个问题是个好主意吗？

所以.我们需要编写一个自定义指令,将"active"类添加到具有"router-link-active"类的所有DOM元素,但我也遇到了一些问题.

有一个类似的问题,但答案太复杂,不适合我.所以我读了一些文档,决定做更好的事情:

commons.ts:

@Directive({
    selector: '.router-link-active',
    host: {'[class.active]': 'trueConst'} //just 'true' could also work I think...
})
export class ActiveRouterLinkClass {
    trueConst: boolean = true; //...if 'true' works we don't need this
}

然后我将ActiveRouterLinkClass导入到我的main.component.ts并将其添加到组件的指令列表中.不幸的是,现在我有这个错误:"EXCEPTION:组件'Main'视图上的意外指令值'undefined'".请解释我做错了什么!