Question

我正在尝试使用自定义逻辑将活动类应用于我的路线，由于某些原因routerLinkActive无效（可能是我的父级和子级路由是动态的）。这是代码：

<ul class="navbar-nav">
   <li class="nav-item eds-service"
     *ngFor="let service of services"
     [routerLink]="['', _dataService.flavor, service]"
     [ngClass]="{'active': _urlService.getCurrentService() === service}"
     (click)="changeService(service)">
     {{ service | readableName | titlecase }}
   </li>
</ul>

我的路由文件如下：

{ path: ':flavor', component: ComparePageComponent },
{ path: ':flavor/:service', component: ComparePageComponent }

加载页面时，出现以下错误：

ServicesComponent.html：10错误错误： ExpressionChangedAfterItHasBeenCheckedError：表达式已更改经过检查后。先前的值：“ active：false”。当前值： “有效：真实”。

我尝试使用AfterViewInit，AfterViewChecked，但无济于事。

我要去哪里错了？

Answer 1

尝试一下：

public constructor(private changeDetector: ChangeDetectorRef) {}

public ngAfterViewInit(): void {
    this.changeDetector.detectChanges();
}

参见此处：https://blog.angularindepth.com/everything-you-need-to-know-about-the-expressionchangedafterithasbeencheckederror-error-e3fd9ce7dbb4

带有ngClass且没有子组件的ExpressionChangedAfterItHasBeenCheckedError

1 个答案: