Angular 在角度方向上更改路线更改时更改页脚背景颜色

有一个页脚组件，其前两行如下所示：

footer.html

<footer class="footer" [class.footer_bg-white]="wide">
  <div class="footer__inner" [class.footer__inner_wide]="wide [class.footer__inner_auth]="!authorized">

<footer class="footer" [class.footer_bg-white]="wide || isOffer">
  <div class="footer__inner" [class.footer__inner_wide]="wide [class.footer__inner_auth]="!authorized">

因此，当

wide

为

false

但我们在报价页时，

isofer

设置为

true

，页脚应变为白色。

footer.ts

文件中负责此操作的部分如下所示：

footer.ts

 ngOnChanges() {
    this.router.events.subscribe(
      event => {
        if (event instanceof NavigationStart && event.url === "/offer") {
          this.isOffer = true;
        }
      }
    );
  }

这样做的问题是，当我打开菜单并转到该页面时，路线会发生变化，

isOffer

变为

true

，但页脚背景色不会改变，我需要重新加载页面以应用更改。这样看来，我必须再次重新创建页脚组件

---

如何实现所需的行为？

不会捕获初始路由器更改，因为组件中有

页脚。您必须获取当前路由器路径才能使其工作

ngOnInit（）{
if（this.router.url==“/offer”）{
this.isOffer=true；
}
}
使用而不是直接更改HTML元素的类。@Nikhil你是说这样吗<代码>[ngClass]=“{'footer_bg-white'：isSpecial}”

，如果我这样做，行为将保持不变。还可以将其他元素更改为使用

ngClass

。确保您在任何地方都使用了

isSpecial

，看起来您是从

Isofer

重命名的。哦，对不起，是的，我不小心重命名了它。我把它改成了

[ngClass]=“{'footer|u bg-white'：wide | | isOffer}”

，但在行为方面没有任何改变，它仍然是一样的。在我看来，我确实需要以某种方式重新加载组件，我是指页脚组件，但我必须以编程方式来完成这项工作。但是我不确定……@igor你能试着在

footer.ts

中用

ngonit

替换

ngOnChanges

吗？