Javascript 以角度在组件之间传递文件

我想将一个文件传递给第二个具有角度的组件

this.router.navigate(['/secondComponent'], { queryParams: { file: File}})

或者通过formData传递它

 var formData: any = new FormData();
 formData.append("file", file);
 this.router.navigate(['/secondComponent'], { queryParams: { file: File}})

---

它不是这样工作的。我该怎么做？感谢

您可能想考虑通过路由器传递文件ID或文件名，然后在路由后重新加载文件。

---

你要记住的是，用户可以点击浏览器刷新按钮，在这种情况下，需要根据URL生成整个页面及其所有内容。

< P>如果您希望在角度路由组件之间进行适当的异步导航，则应考虑使用“代码”> RXJS 库，该库是由角度提供的。您可以按照以下步骤实现此目标：

使用首选名称创建新服务

在服务中创建一个新的

主题

，并在路由的组件中订阅它

在路由之前，将文件对象作为主题中的值发出

---

你有几个选择。通过查询参数传递整个

文件

对象将不起作用。我想从技术上讲，如果您将整个文件体作为URL中的字符串参数传递，那么它可能会起作用，但我不建议这样做

您可以做什么：

• 使用本地存储
• 将单例服务用于存储目的
• 在导航附加中传递

  文件

  对象

为了坚持您当前的设置，我建议使用第三个选项并执行以下操作：

this.router.navigate（['/some route']，{state:{data:myFile}}）

你能告诉我怎么做吗？我是个初学者，我很困惑。感谢您正在第一页加载文件。你能在第二天也这样做吗？或者，如果它是用户生成的文件，您需要将文件保存在某个位置，然后将其加载到第二个路由页面中。您有关于第三个选项的教程吗。我是初学者。或者你能给出一个通过导航附加程序传递文件的代码示例吗？是的，代码片段粘贴在答案中。您应该能够使用该方法，而不是当前的方法。要获得值，您必须拉入激活的路线并查看导入的内容。如果您可以在stackblitz中复制当前代码，我将向您展示如何使用导航附加功能