关于#angular#sessionStorage的问题，如何解决？

Question

angular，有列表和编辑两个页面。列表页包含多个查询条件及分页，选中一条数据进行编辑，路由更新至编辑页，编辑完成后返回列表页,编辑页有 (更改 删除) 两个按钮，在编辑页用sessionStorage保存了更改/删除的数据

在列表页怎么取到我点击 哪个按钮呢 (更改 删除)

Answer 1

这个框架我也很少用，我可以给你个参考答案，引用GTP的回答：
在列表页中，你可以通过以下步骤获取到用户点击了哪个按钮（更改或删除）：

1、在列表页面的 HTML 文件中，为每个按钮添加一个点击事件：

```javascript
<button (click)="onEditButtonClick()">更改</button>
<button (click)="onDeleteButtonClick()">删除</button>

2、在列表页面的对应的 Angular 组件类中，定义两个方法 onEditButtonClick() 和 onDeleteButtonClick() 来处理按钮点击事件：

import { Router } from '@angular/router';
import { Component } from '@angular/core';

@Component({
  selector: 'app-list',
  templateUrl: './list.component.html',
  styleUrls: ['./list.component.css']
})
export class ListComponent {
  constructor(private router: Router) { }

  onEditButtonClick() {
    // 处理“更改”按钮的点击事件
    this.router.navigateByUrl('/edit');  // 导航至编辑页面
  }

  onDeleteButtonClick() {
    // 处理“删除”按钮的点击事件
    // 执行删除操作
  }
}

3、在列表页面中，当用户点击“更改”按钮时，会触发 onEditButtonClick() 方法并导航至编辑页面。你可以在导航时传递参数，以便在编辑页面中知道要编辑哪条数据。

<button (click)="onEditButtonClick(item)">更改</button>
typescript
onEditButtonClick(item: any) {
  // 处理“更改”按钮的点击事件
  this.router.navigateByUrl(`/edit?itemId=${item.id}`);  // 导航至编辑页面并传递参数
}

4、在编辑页面的对应的 Angular 组件类中，可以通过路由参数来获取要编辑的数据的 ID.

```javascript
import { ActivatedRoute } from '@angular/router';
import { Component } from '@angular/core';

@Component({
  selector: 'app-edit',
  templateUrl: './edit.component.html',
  styleUrls: ['./edit.component.css']
})
export class EditComponent {
  itemId: string;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    // 获取路由参数中的 itemId
    this.route.queryParams.subscribe(params => {
      this.itemId = params.itemId;
    });
  }

  onSaveChanges() {
    // 处理保存更改的操作
    // 使用 sessionStorage 保存更改的数据
  }

  onDelete() {
    // 处理删除操作
    // 使用 sessionStorage 保存删除的数据
  }
}

这样，在列表页中，当用户点击“更改”按钮时，会导航至编辑页面，并将要编辑的数据的 ID 作为参数传递给编辑页面。而当用户点击“删除”按钮时，你可以在列表页的 onDeleteButtonClick() 方法中执行删除操作，并将删除的数据保存到 sessionStorage 中。