如何防止 Angular 2 事件中的分页组件工作

Question

我正在使用来自ngx-bootstrap/pagination pagination组件。喜欢这个：

<pagination *ngIf="returnedArray"
    [totalItems]="contentArray.length"
    (pageChanged)="pageChanged($event)"
    [itemsPerPage]="1"
    [boundaryLinks]="false"></pagination>

我希望寻呼机在满足某些条件之前不要导航到下一页，但找不到如何实现它。

我尝试了几件事：

1. 从pagination组件中删除(pageChanged)="pageChanged($event)"。但导航仍在燃烧。
2. 试图制作类似event.preventDefault()的东西，但这里不存在

Answer 1

pageChange是一个事件发射器，因此当用户使用分页器更改页面时，您可以执行函数。所以它在那一刻已经改变了页面。

查看 GitHub 上分页组件的源代码，我看到有一个disabled输入选项。
也许你可以做这样的事情：

<pagination *ngIf="returnedArray"
    [totalItems]="contentArray.length"
    (pageChanged)="pageChanged($event)"
    [disabled]="methodWithYourConditions()"
    [itemsPerPage]="1"
    [boundaryLinks]="false"></pagination>

然后，您在此 disabled 属性中引用的函数可以检查多个条件。

Answer 2

我发现解决这个问题的唯一方法是隐藏分页器组件，然后用一个按钮模拟满足条件时的分页点击，如下所示：

(<HTMLInputElement>document.querySelector('#next .pagination-next .page-link')).click();

棘手。。。丑。。。但工作:)