角6中的分页概念

Question

我使用两个页面，产品列表页和产品详细信息页。

在产品清单上，我有100种产品。每页10个产品。我使用“下一步”和“前一个”按钮从一个页面移动到另一个页面。

​

分页就像0,1,2，-，10。下一页我也有10张记录。

我在RouterLink product_list中使用了视图按钮。喜欢,

          <td>
             <a class="badge badge-view-btn" [routerLink]="['/product/view',p.id]">View </a>
          </td>

把按钮从product_detail还给product_list

喜欢

<button class="btn btn-primary btn-pill btn-lg m-b-15rem" (click)="back()">
            <i class="fa fa-angle-left fa-lg m-r-10"></i>Back</button>

  back() {
   this.location.back();
   }

我也已经为这张桌子申请了分页。

挑战：

1. ，如果我进入产品15 (第2页)并点击查看按钮，
2. ，然后在单击后退按钮时，我必须进入第2页本身，而不是第1页。通过给this.location.back();，它将返回到第1页.

如果我要上第二页，我想做什么？？

Answer 1

您的产品列表页面路线也应该包括分页索引。例:/产品/产品清单?页面索引=1

因此，当下一个和前一个按钮单击事件更改路由器queryParam时，您可以侦听路由更改事件并更新数据。现在，因为当您调用'this.location.back()‘时，路由器中包含了页面信息，这将自动使您更正分页。