ngx-auto-scroll 是一个 Angular 插件，它可以让长内容自动滚动到底部，是一个非常实用的前端工具，本篇文章将为大家详细介绍如何使用该插件，并提供示例代码方便学习和使用。
安装
首先我们需要使用 NPM 安装 ngx-auto-scroll 所有依赖项：
npm install ngx-auto-scroll --save
用法
首先，我们需要在 app.module.ts 中引入 ngx-auto-scroll：
import { NgxAutoscrollModule } from 'ngx-auto-scroll';
@NgModule({
imports: [
NgxAutoscrollModule
]
})
export class AppModule { }然后，我们就可以在需要自动滚动的地方使用 ngx-auto-scroll 指令。下面是一个简单的用法示例：
<div class="container" ngxAutoScroll>
<p *ngFor="let message of messages">{{ message }}</p>
</div>在上面的例子中，将使用 ngxAutoScroll 指令将 <div> 元素转换为自动滚动容器。ngFor 指令将动态添加消息元素。
高级用法
ngx-auto-scroll 还拥有一些高级用法，可以实现更加复杂的自动滚动效果。下面是一个实例：
<div class="container" ngxAutoScroll [normalized]="true" [autoScroll]="true" [autoScrollSpeed]="0.5" [autoScrollStopOnHover]="true">
<p *ngFor="let message of messages">{{ message }}</p>
</div>通过指定相应的属性，我们可以对自动滚动进行控制：
normalized：是否要启用标准化滚动（默认为false）。autoScroll：是否自动滚动（默认为false）。autoScrollSpeed：自动滚动速度（默认为1）。autoScrollStopOnHover：当鼠标悬停在容器上方时停止自动滚动（默认为false）。
备注
ngx-auto-scroll 是一个非常实用的前端工具，可以帮助我们实现自动滚动的效果，并且可以通过指定相应的属性，对滚动进行更加精细的控制。相信大家在使用这个工具之后会有更加好的编程体验。
示例代码：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------------
--------- -----------
--------- -
---- ----------------- ------------- ------------------- ------------------- ----------------------- -------------------------------
-- ----------- ------- -- ------------ ------- ------
------
--
------- --
---------- -
------- ------
------ ------
----------- -------
-
- -
---------- -----
-------- -----
------- --
-
--
--
------ ----- ------------ -
-------- - -
------ ---------
------- ---------
------ ---------
------- ---------
------ ---------
------ ---------
-------- ---------
------- ---------
------ ---------
------ --------
--
-来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005753a81e8991b448ea479