Angular中使用ngx-pagination与ngx-bootstrap/pagination时点击下一页光标始终居中是否为正常行为？

你好呀！针对你遇到的这个问题，我来帮你梳理下~

首先明确说：这种光标始终居中的情况并不是ngx-pagination和ngx-bootstrap/pagination组件的正常默认行为哦。

通常来说，这两个分页组件在切换页码时，只会更新列表数据，并不会主动触发页面滚动或者光标定位到中间的操作。出现这种情况，大概率是项目中的自定义代码或样式导致的，常见原因有这几种：

• 页面或列表容器添加了自定义滚动样式，比如设置了scroll-behavior: smooth，或者有其他滚动定位的CSS规则，导致切换分页时触发了意外的滚动效果；
• 你在分页切换的回调逻辑（比如(pageChange)事件处理函数）里，不小心加入了手动控制页面滚动到中间位置的代码；
• 浏览器的自动聚焦行为间接导致：分页切换后某个元素自动获得焦点，浏览器会自动滚动到该元素所在位置，看起来像是光标居中了。

给你几个排查方向：

• 先检查全局样式或者分页相关容器的CSS代码，排查有没有和滚动、定位相关的规则；
• 查看分页切换的事件处理代码，确认是否存在手动控制滚动的逻辑；
• 可以暂时移除所有自定义样式和额外逻辑，只保留基础的分页组件代码（如下所示），测试默认行为是否正常，以此定位问题来源：

import { NgxPaginationModule } from 'ngx-pagination';
import { PaginationModule } from 'ngx-bootstrap/pagination';

从你描述的“实际结果和预期结果不符”的情况来看，这肯定是异常表现，不是组件的正常行为，按照上面的方法排查应该就能找到问题啦。

备注：内容来源于stack exchange，提问作者Suikei