要解决"Angular的ActivatedRoute订阅在路由更改时没有触发"的问题,可以按照以下步骤进行调试和修复:
ActivatedRoute
:import { ActivatedRoute } from '@angular/router';
@Component({
// ...
})
export class YourComponent implements OnInit {
constructor(private route: ActivatedRoute) { }
ngOnInit() {
// ...
}
}
ngOnInit
生命周期钩子中,使用ActivatedRoute
进行路由参数的订阅:import { ActivatedRoute } from '@angular/router';
@Component({
// ...
})
export class YourComponent implements OnInit {
constructor(private route: ActivatedRoute) { }
ngOnInit() {
this.route.params.subscribe(params => {
// 在这里处理路由参数的变化
});
}
}
ngOnInit
生命周期钩子被调用。如果路由参数是通过同一个组件中的链接进行更改的,则ngOnInit
将不会被调用。在这种情况下,可以使用ngOnChanges
生命周期钩子来订阅路由参数的更改:import { ActivatedRoute } from '@angular/router';
@Component({
// ...
})
export class YourComponent implements OnInit, OnChanges {
constructor(private route: ActivatedRoute) { }
ngOnInit() {
// 初始化时订阅路由参数
this.route.params.subscribe(params => {
// 在这里处理路由参数的变化
});
}
ngOnChanges() {
// 当路由参数更改时,ngOnChanges将被调用
this.route.params.subscribe(params => {
// 在这里处理路由参数的变化
});
}
}
router.events
来监听路由的变化。在组件中注入Router
,然后订阅router.events
:import { Router, NavigationEnd } from '@angular/router';
@Component({
// ...
})
export class YourComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
this.router.events.subscribe(event => {
if (event instanceof NavigationEnd) {
// 在这里处理路由参数的变化
}
});
}
}
通过按照上述步骤进行调试和修复,应该能够解决"Angular的ActivatedRoute订阅在路由更改时没有触发"的问题。