在导航到其他页面后刷新离子页面

Question

我在一个ionic应用程序编辑配置文件和查看配置文件。编辑页面的详细信息后，将导航到查看个人资料页面。

我希望视图配置文件页面在导航后刷新。

下面是editprofile.ts中的代码:

首先我使用下面的样式来导航

this.router.navigateByUrl('/view-profile');

通过谷歌搜索，我添加了这个来刷新导航后的视图配置文件

this.router.navigateByUrl('/view-profile')
.then(() => {
window.location.reload();
});

现在发生的事情是，首先它被重定向到查看个人资料页面，没有刷新，它直接重定向到主页，主页刷新。

请帮助我如何从编辑个人资料页面导航后，我只能刷新查看个人资料页面。

Thanks a lot

Answer 1

你应该(几乎)永远不要在ionic中使用location.reload()。这是为(浏览器)网站，在离子你会得到一个空白的屏幕一会儿，这是相当丑陋的。

有几种方法可以达到你的目的。一般来说，你应该总是在不同的页面中传递相同的对象，当你改变属性时，Angular会负责更新视图。

这意味着，如果你有一个这样的对象:

profile = {
ID: 34,
name: "Anthony",
lastname: "Hopkins",
age: "80"
}

您应该将该对象传递给EditProfile页面，这样当您在该屏幕中更改某些内容时，您将返回到概要文件，并且视图将已经更新。这就是Angular数据绑定的魔力。

当您进入EditProfile页面时，可能会调用另一个API来加载更多信息。在这种情况下，不要创建新的配置文件对象。相反，将属性添加到前面的配置文件对象:

profile['city'] = 'London';

---

但是好吧，让我们想象这对你来说是不可能的。在这种情况下，当您返回到Profile页面时，再次调用API并替换当前的概要文件对象。Angular会刷新这个视图:

ngOnInit() {  // or constructor
// do not get user data here, instead call a method
this.getUserProfile();
}
// Call this method, instead of location.reload()
getUserProfile() {
API.getProfile( profile => {
this.profile = profile;  // view will refresh
});
}

如果问题是你不知道如何将参数从一个页面传递到另一个页面，那么搜索如何解决这个疑问，但不要试图回避它。

您可以使用服务传递参数，例如。在整个应用程序执行过程中，服务作为单个实例保持。所以你可以设置服务。参数在一个页面中，并获得服务。参数