ngx-滑动器

网站: https://angular-sliver.github.io/ngx-sliver/ (英语)

解析器 : https://discord.gg/DHsDghZRwZ 互联网档案馆的存檔,存档日期2013-12-21

Angular 的自成一体、便于移动的滑动组件 角滑动器。 。 。 .

依赖关系

说明: 和Angular一样,只有最新的3个版本得到了积极的支持.

演示文稿

• 单滑- 堆叠布立茨

  

• 范围滑动器 - 堆叠布立茨

  

• 带有勾选的滑动器 - 堆叠布立茨

  

• 自定义幻灯片 - 堆叠布立茨

  

• 带有自定义样式的滑动器 - 堆叠布立茨

  

• 垂直滑动器 - 堆叠布立茨

  

• 官方网站更多实例

安装

要将滑动器添加到您的角工程中 :

npm install --save @angular-slider/ngx-slider

安装后, 将滑动器添加到您的 app.module.ts数字 :

import { NgxSliderModule } from '@angular-slider/ngx-slider';

...

@NgModule({
   ...
   imports: [
     ...
     NgxSliderModule,
    ...
   ],
   ...
})
export class AppModule {}

样本使用情况

您现在可以使用应用程序组件中的滑动组件, 例如 app.component.ts数字 :

import { Options } from '@angular-slider/ngx-slider';
...

@Component({...})
export class AppComponent {
  value: number = 100;
  options: Options = {
    floor: 0,
    ceil: 200
  };
}

在模板文件中 app.component.html数字 :

<ngx-slider [(value)]="value" [options]="options"></ngx-slider>

文档

API 文档全文可见于 官方网站 (简体中文)。 。 。 .

样式

如何将自己的风格应用到滑动器的概述如下: 击打.md。 。 。 .

动画

至v1.2.0,滑行器的功能是滑行器运动的CSS动画. 如果你更喜欢以前的行为,不用动画,可以设置旗帜 animate: false 在幻灯片选项中.

键盘快捷键

除了鼠标/触摸事件,滑动器也可以通过键盘来控制. 可用的快捷方式有:

• 右/上箭头 - 逐个增加,
• 左下箭头 -- -- 逐个减少,
• 页面上行 - 将滑动范围增加10%,
• 下行- 滑动范围减少10%,
• 家 - 移动到最小值,
• 结束 - 移动到最大值.

工具提示

滑动器允许自定义如何执行工具提示. 见 托尔蒂斯·姆德 更多信息.

已知问题

在报告新错误之前,请看 识相相相克. md 一份已知问题清单 及其工作。 无法接受针对这些问题的新错误报告 .

错误

您可以将任何错误报告为 Github 问题。 。 。 .

请详细描述在任何相关代码上粘贴的问题,或者最好用StackBlitz来复制问题 伪造并编辑此样本 StackBlitz还请提供您正在使用的国家预防机制软件包.

更改日志

关于修改和错误修正的列表,参见 变动情况。 。 。 .

开发者信息

如果你想为该项目捐款,请看 最不发达国家。 。 。 .

许可证

该项目根据麻省理工学院的许可证获得许可证.

升级

关于图书馆以前版本(1.x)的升级说明,见 更新(md)。 。 。 .