Angular的routerLink只会触发一次ngOnInit
创始人
2024-10-24 09:31:14
0

在Angular中,routerLink只会触发一次ngOnInit的问题可以通过以下解决方法解决:

  1. 使用routerLinkActive指令:routerLinkActive可以在当前路由激活时添加一个CSS类,我们可以利用这个特性来触发组件的变化。在组件的ngOnInit方法中,我们可以监听routerLinkActive指令的isActive属性,并根据isActive的值来执行相应的逻辑。
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-example',
  template: `
    Link
  `,
})
export class ExampleComponent implements OnInit {
  ngOnInit() {
    this.rla.isActive.subscribe((value: boolean) => {
      if (value) {
        // 执行相应的逻辑
      }
    });
  }
}
  1. 使用路由守卫:可以在路由守卫中监听路由变化,并在路由变化时执行相应的逻辑。
import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';

@Component({
  selector: 'app-example',
  template: `
    Link
  `,
})
export class ExampleComponent implements OnInit {
  constructor(private router: Router) {}

  ngOnInit() {
    this.router.events.subscribe((event) => {
      if (event instanceof NavigationEnd && event.url === '/example') {
        // 执行相应的逻辑
      }
    });
  }
}

这两种解决方法都可以在routerLink被点击时执行相应的逻辑,而不仅限于ngOnInit方法。

相关内容

热门资讯

透视规律!wepoker透视脚... 透视规律!wepoker透视脚本下载,htx矩阵wepoker辅助(详细软件)1、构建自己的wepo...
透视软件!aapoker透视脚... 透视软件!aapoker透视脚本下载(透视)aapoker插件下载,细节方法(有挂揭秘)一、aapo...
透视总结!wepoker轻量版... 透视总结!wepoker轻量版书签,wepoker有没有辅助(详细俱乐部辅助);1、下载好wepok...
透视最新!aapoker透视方... 透视最新!aapoker透视方法(透视)aapoker辅助器怎么用,普及教程(有挂黑科技);1、进入...
透视好牌!wepoker辅助器... 透视好牌!wepoker辅助器安装包定制,wepoker能不能透视(详细透视脚本)1、完成wepok...
透视代打!aapoker辅助器... 透视代打!aapoker辅助器怎么用(透视)aapoker怎么设置提高好牌几率,新版2025教程(有...
透视工具!wepoker透视底... 透视工具!wepoker透视底牌,wepoker透视苹果系统(详细有人玩)所有人都在同一条线上,像星...
透视安装!wepoker轻量版... 透视安装!wepoker轻量版透视系统,wepoker买钻石有用吗(详细辅助软件教程)1)wepok...
透视脚本!aapoker透视插... 透视脚本!aapoker透视插件(透视)aapoker辅助工具安全吗,攻略教程(有挂插件);1、aa...
透视中牌率!aapoker俱乐... 透视中牌率!aapoker俱乐部靠谱吗(透视)aapoker怎么选牌,透牌教程(有挂揭秘)在进入aa...