javascript - Angular 路线和事件链接

标签 javascript jquery angularjs angular-ui-router

我正在尝试根据网址中的当前位置突出显示导航栏上的选定链接。为此,我在导航栏 Controller 中编写了以下函数:

$scope.isActive = function(route) {
  return route === $location.path();
};

在 html 中我有这个:

<li ng-class="{active: isActive('/admin')}"><a href="/admin">Admin</a></li>

这对于简单的 url 效果很好,但对于带有 id 和子路径的 url 效果不佳。我的意思是,如果我将 url 作为“item/:id”,它在 isActive 函数中不匹配并且不会突出显示,我也想突出显示相同的 li对于多个子路线,如 item菜单应突出显示 items & items/:id & items/my 。知道如何实现这一目标吗?

最佳答案

试试这个

<li ng-class="{isActive('/admin')? 'active' : ''}"><a href="/admin">Admin</a></li>

$scope.getActiveClass = function(route) {
  return (route === $location.path())? 'active' : '';
};


//in directive
<li ng-class="getActiveClass ('/admin')"><a href="/admin">Admin</a></li>

关于javascript - Angular 路线和事件链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27182114/

相关文章:

javascript - jQuery 或 Javascript - 如何在不溢出的情况下禁用窗口滚动 :hidden;

javascript - 在 Angular 中,在两个不同的指令之间传递匹配的 $index

javascript - 使用点击类查找 div 的 ID

javascript - 无法使用 jQuery 将数据写入 txt 文件

javascript - Jquery删除带有特定标签的链接以及该链接后的整个文本

javascript - 如何在reactjs前端正确地将pdf字符串转换为pdf? (带有 puppeteer 的空白pdf)

php - 使用PHP中的套接字编程(Erlang)聊天应用程序

javascript - AngularJS 未捕获引用错误 : response is not defined

javascript - 创建一个用于图像上传的 md 对话框,在 angularjs 中进行图像查看、裁剪和上传

javascript - javascript 中的困惑、this 指针和事件