在Angular2（RC3）中根据当前路由设置状态

19 浏览
0 Comments

在Angular2（RC3）中根据当前路由设置状态

假设我有一个典型的设置，一个侧边栏菜单，我可以在其中选择一个选项，并在右侧显示该选项的内容。

我想使用一系列`routerLink`指令来构建侧边栏菜单，如下所示：

@Component({
  selector: 'side-menu',
  template: `
        
`
})

此外，我想使用`class="active"`来突出显示相应的`

  • `元素。我该如何做？

    当然，总是可以使用`click()`加上事件处理程序，但我认为在这里只使用`routerLink`要比处理事件更简洁。

    我想提供一个plnkr，但是看起来当前的Angular2模板一旦从`@angular/router`导入后就会出错，我猜这是因为RC3中的npm缺少路由器捆绑包。

    • 0

    1 答案

    0 Comments

    Angular2中的路由器在不断变化，所以如何根据当前路由设置状态是一个常见的问题。解决方法是使用routerLinkActive指令，在routerLink中使用。具体代码如下：

    
    Hello Link

    有时候会出现错误“Cannot read property 'pathsWithParams' of undefined”，解决方法是添加[routerLinkActiveOptions]="{exact:true}"。具体代码如下：

    [routerLinkActiveOptions]="{exact:true}"

    关于如何订阅当前路径以帮助创建面包屑导航的问题，暂时无解。

    0