当他处于活动状态Angular 2时添加/删除课程路由

Question

I want to add the done classes to the routing when I change it in another component: For example: I am in step1(component) click "go to step 2" in navbar routing component step1 receives classes done

my navbar.html (component)

<li routerLinkActive="active" [routerLinkActiveOptions]="{exact:true}"  class="step"><a [routerLink]="['step1']">
          <h4 class="list-group-item-heading">Miejsce i data</h4>
        </a></li>
        <li routerLinkActive="active" class="step disabled"><a [routerLink]="['step1']">
          <h4 class="list-group-item-heading">Wybierz samochód</h4>
        </a></li>

my step1.html (component)

 <button (click)="goStep2()">go to step 2</button>

Answer 1

1. You could set up a variable step1Done = false and when goStep2() is called, within that function set this.step1Done = true and then bind that value to a class in your html [class.done]='step1Done

2. you could handle all of that in the .ts component, use a template reference in your html <div #myDiv> get the element in your .ts file with @ViewChild() myDiv; and then in your goStep2() function add the class this.myDiv.nativeElement.classList.add('done')