单击角度4将活动类添加到子菜单

时间:2018-08-08 06:33:54

标签: html css angular typescript angular5

我在Angular 4中创建了一个嵌套菜单。我面临着活动类的问题。这是我的代码。

My code

我能够将活动类添加到主链接,但是我应该怎么做才能根据点击将活动类添加到子菜单。请帮助

1 个答案:

答案 0 :(得分:2)

您可以创建一个对象来存储为main链接和sub链接选择的内容,然后相应地应用该类。

例如,您可以传递main作为参数,以表明它是主要链接,并相应地检查isActive本身是否为main

(click)="select('main', n.name);" [ngClass]="{active: isActive('main', n.name)}"

类似地,可以通过sub链接来完成。

您的功能可能如下:-

  select(type, item, $event) {
    this.selected[type] = (this.selected[type] === item ? null : item);
    $event ? $event.stopPropagation() : null;
  }
  isActive(type, item) {
    return this.selected[type] === item;
  }

我想,选择可选的子链接时,您可能会停止传播(请测试您的用例)。

请检查以下代码:-

  

https://stackblitz.com/edit/angular-7b7cwd?file=src/app/app.component.html