如何通过 ionic 中的激活路由传递 URL？答案

【问题标题】：How to pass URL through activated route in ionic?如何通过 ionic 中的激活路由传递 URL？
【发布时间】：2019-02-12 15:20:54
【问题描述】：

我在第 1 页的 Ionic 应用程序中有一个按钮。通过这个按钮，我正在调用一个名为 myfunc(item.url) 的函数。

<ion-item (click)="myfunc(item.url)">
        <ion-label color="primary"> Click here! </ion-label>
</ion-item>

myfunc(item.url) 的函数是这样的：

myfunc(imageUrl:string) {
    this.nav.navigateForward('/page2/${imageUrl}');
}

在这里，我将一个 URL 从 page1 传递到 page2，格式为 http://example.com/xyz。

我面临的问题是，当我传递一个 url 时，只有 http: 被存储在变量中。那就是我无法使用正斜杠获取整个网址。

ngOnInit() {
    this.receivedUrl = this.activatedRoute.snapshot.paramMap.get('imageUrl');
    /* Expected Output: this.receivedUrl = "http://example.com/xyz" but 
       Obtained Output is: this.receivedUrl = "http:" */
}

请帮我获取整个 url 而不仅仅是 http: 。提前谢谢你。

【问题讨论】：

在 queryParams 中传递你的图片 url
@KajolChaudhary 你能给我一个示例代码 sn-p，因为我是 ionic 新手吗？谢谢

标签： angular ionic-framework ionic4

【解决方案1】：

在传递为 url 之前编码图像 URL 具有特殊字符，因此您无法获取整个图像 url

this.nav.navigateForward(`/page2/${encodeURI(imageUrl)}`);

【讨论】：

this.router.navigate( ['/page2'] , { queryParams: { imageUrl: imageUrl }}); } 试试这个
this.nav.navigateForward(/page2/?imageUrl=${encodeURI(imageUrl)});