ng-bootstrap分页不生效，设置pageSize后仍展示全部数据如何解决

• 遍历数据源错误
  TS侧分页计算后的结果存储在productsArray数组中，但HTML模板*ngFor指令遍历的是未分页的原始完整数组products，所以会展示全部数据。
  修复：将<tr *ngFor="let product of products">修改为<tr *ngFor="let product of productsArray">
• 事件绑定方法名不匹配
  TS中定义的分页刷新方法名为refreshProduct，但ngb-pagination组件的pageChange事件绑定的是refreshProducts()，多了一个后缀s，切换页码时无法触发数据刷新逻辑。
  修复：将(pageChange)="refreshProducts()"修改为(pageChange)="refreshProduct()"
• 分页参数配置问题
  1. 当前TS中默认pageSize值为4，若需要每页展示3条数据，直接修改该参数值为3即可
  2. 建议不要写死collectionSize为固定值8，获取到接口数据后动态赋值为this.collectionSize = this.products.length，避免数据总量变化时分页组件展示异常
• 其他可优化点（不影响分页功能）
  表格内产品图片的src属性写死为data:image/png;base64，没有绑定实际产品对应的图片字段，可补充绑定逻辑。

内容的提问来源于stack exchange，提问作者a_l_e_x