angular - Angular5,在路由上,网址发生了变化,但它没有加载相同的页面
问题描述
单击下一步时,URL 正在发生变化,但根据 url 的页面没有加载。当我单击下一步时,网址会更改,如果我使用相同的网址刷新页面,则会加载正确的页面。下面是我的 ts 和 html 代码。
关于 ts
ngOnInit() {
const queryParams = this.route.snapshot.queryParams; // store query param value
this.index = queryParams.index;
this.step = queryParams.step;
this.flowType = queryParams.flowType;
this.stepper.selectedIndex = Number(this.step);
console.log(this.index, "this.index", this.step, "this.step", this.flowType, " this.flowType");
}
在 HTML 上
<div *ngIf="flowType === 'Prescription Drug Plan'">
<app-form-navigation (customHandle)="setApplicationQualification()" isQueryParamPreserve='true'
nextPath="enrollments/steps/find-a-drug" [queryParams]='{index:2, step:0}' >
</app-form-navigation>
</div>
解决方案
如果您不离开它,Angular 将不会重新加载相同的组件。你应该使用类似的东西:
constructor(protected route: ActivatedRoute){
}
ngOnInit(){
this.route.queryParams.subscribe(params => this._init(params));
}
_init(queryParams){
this.index = queryParams.index;
this.step = queryParams.step;
this.flowType = queryParams.flowType;
this.stepper.selectedIndex = Number(this.step);
console.log(this.index, "this.index", this.step, "this.step", this.flowType, " this.flowType");
}
推荐阅读
- php - 如何从 Laravel Nova 的文件下载中删除不需要的换行符?
- c - 如何在 C 中读取包含 EOF 字符的非文本文件?
- php - Laravel - 刀片;如何在@foreach 循环中循环遍历具有不同顶级标题的嵌套 json 对象
- string - 在 Smalltalk 中查找字符串末尾的数字的方法
- xaml - Xamarin 表单选项卡式页面触发器属性不起作用
- c# - 通过电报机器人保存电话号码
- php - 在ajax中将Symfony表单从一个视图传递到另一个视图
- c - 如何将字符串 UTC 时间格式 YYYYMMDDHHMMSS.MMMMMMSUTC 的时间转换为时间戳格式,将 DDDDDDDDHHMMSS.MMMMMM:000 转换为 C 中的间隔格式?
- python - 以矩阵格式打印列表列表
- java - 从 JavaFX 中的媒体文件中检索元数据专辑封面