首页 > 解决方案 > 如何返回到包含角度选定下拉数据的上一页?

问题描述

我有一个页面A,其中有一个下拉菜单。在选择下拉值对应的列表来。单击列表中的一个名称时,它会重定向到另一个页面B执行一些操作。在B页上,我们有一个名为back的按钮。我希望每当按下后退按钮时,它都会重定向到上一页,其中列表基于选择的下拉值。我怎样才能做到这一点。?

pageA.component.html

          <div class="row">
        <div class="col-md-6 txt-box">
          <div class="runTextBox">
            <select
              type="number"
              class="control"
              (ngModelChange)="onChangeGroup($event)"
            >
              <option hidden value="" disabled="true"
                >Please select Group Name
              </option>
              <option
                *ngFor="let anaName of getGroupList"
                type="number"
                [ngValue]="anaName.Id"
              >
                {{ anaName.GroupName }}
              </option>
            </select>
          </div>
        </div>
      </div>

          <div class="list_table">
        <table class="table tabs">
          <thead>
            <tr>
              <th>Sub Group Name</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let data of startedSubGroupList; let x = 
                index">
              <td>
                <a [routerLink]="" 
                 (click)="showSubGroupData(data.Info)"> 
                {{ data.subGroupName}}</a>
              </td>

            </tr>
          </tbody>
        </table>
      </div>

pageA.componet.ts

 onChangeGroup(value) {
      this.groupId = value;
      this.viewAnaServ.getSubGroupList(value).subscribe((res: any) => {
      this.startedSubGroupList = res;
      console.log(this.startedSubGroupList);
  });
}

showSubGroupData(v) {
   this.viewAnaServ.getDataInfo(v)
   this.router.navigate(["/dashboard/anaview/PageB"]);
}

pageB.component.html

 <div class="row">
    <div class="col-md-12">
     *some operation*
    </div> 
 </div>
 <button (click)="backToPageA()">Back</button>

pageB.component.ts

backToPageA(){
  this.router.navigate(["/dashboard/anaview/PageA"]);
}

从 PageA 的下拉列表中选择组时,出现子组列表。单击其中一个子组时,它被重定向到 pageB。我希望当单击 backToPageA 按钮时,它会转到包含所选组及其子组列表的 PageA。

标签: angular

解决方案


您可以通过角度路由来实现这一点。您可以创建 2 个路由,第一个用于页面 A,第二个用于页面 B。因此,当您单击页面 A 的下拉菜单时,您可以重定向到页面 B。同样,当您单击页面 B 上的后退按钮时,您可以重定向到页面 A .


推荐阅读