我在Angular 2应用程序中进行分页，使用方便的ng2-pagination模块。现在，我希望能够在组件之间传递信息。我有几个具有唯一api调用的组件，它们都将其内容加载到相同的表格显示中。因此，表格显示是具有表格视图的组件。
我已经使用表格视图将组件与数据绑定到组件，使用方括号表示法来绑定＆＃34;记录＆＃34;，如下所示：
<tabular-display [records]="records"></tabular-display>
然后，在表格显示中＆＃39;我正在使用@Input（）装饰器来访问那些记录数据，如下所示：
@Input() records = [];
在表格显示组合视图中，我迭代了那些记录数组，然后将它们传递给分页管道，如下所示：
<tr *ngFor="let record of records.data | paginate: { id: 'clients', itemsPerPage: 12, currentPage: page, totalItems: records.count }">
现在，在表格显示＆＃39;的表格下方。看来，分页管道使用＆＃39;分页控制＆＃39;处理从上面的* ngFor迭代生成正确数量的页面。看起来像这样：
<pagination-controls class="paginator" (pageChange)="pageChange($event)" id="clients"
maxSize="15"
directionLinks="true"
autoHide="true">
</pagination-controls>
我的最后一项任务是让这个＆＃34; pageChange（）＆＃34;您在上面看到的事件将该事件传递给数据组件 - 因此可以调用正确的数据。怎么做到最好？我已经尝试使用@Output（）和EventEmitter（）：
@Output() sendChange = new EventEmitter();
pageChange($event) {
this.sendChange.emit(this.page);
console.log($event);
}
我将正确的页码打印到控制台。但是，数据组件如何接收（即有权访问）发出的数据？它如何收到＆＃39;发出数据？
顺便说一句，这是我需要将页面更改事件传递给的函数。数据组件中的此函数如何获取从表格显示组件发出的事件？
getPageByCategory(page) {
this.clientsService.getByCategory('consulting', page, this.pagesize)
.subscribe(resRecordsData => {
this.records = resRecordsData;
this.page = page;
console.log(page);
},
responseRecordsError => this.errorMsg = responseRecordsError);
}
答案 0 :(得分：0)
在pageChange上，更改/获取记录的内容及其对应的页面。更改检测将自动更新表格显示组件。