时间戳

首页 > 解决方案 > 我想从 URL 中隐藏查询参数。我怎样才能达到同样的效果？

angular - 我想从 URL 中隐藏查询参数。我怎样才能达到同样的效果？

问题描述

我正在一个列出候选人列表的应用程序中工作。当我点击候选人姓名时，它应该会打开一个包含候选人详细信息的新选项卡。

我将各自的 CandidateId 存储在本地存储中，并在新选项卡中打开窗口，我从本地存储中检索候选 ID 并获取数据。

我面临的问题是，如果我在新选项卡中打开多个候选人，则候选 ID 将被最新的候选 ID 覆盖。因此，如果我刷新新选项卡中的候选人详细信息页面，获取最新打开的候选人的数据。

我想在查询参数中发送candidateId并隐藏查询参数。

谁能建议我如何做到这一点或任何其他选择？

标签： angularangular2-routing

解决方案

您可以使用 FormData 接口

public getCondidate(id: string): Observable<Condidate> {
    const formData: FormData = new FormData();
    formData.append('condidateId', id);
    return this.http.post<Condidate>(%server_Url%, formData);
}

使用可以通过在Query中查询参数“condidateId”来检索后端的Id。这样，查询参数将包含 condidateId，因为它不会显示在您使用开发人员工具并检查网络部分中的查询的 url 中。

除非您有登录或身份验证机制，否则不要将 condidateId 保存在 localStorage 中。当您在从数据库中检索到所有条件后列出它们时，您调用 onClick 以打开具有相应详细信息的页面的方法应使用相应的 ID 调用。例如

<div
  <ul>
    <li *ngFor="condidate of condidates">
      <button (click)="getCondidate(condidate.id)">Get Condidate</button>
    </li>
  </ul>
</div>

getCondidate(condidate.id) 方法应该调用前面的代码。

希望能帮助到你。

推荐阅读