Angular 4 material: md-slider 滑动不流畅

Question

我在 angular 4 应用程序（使用 angular-cli 生成）上使用 material 设计。更准确地说，我使用的是 md-slider。

这几乎可以正常工作...唯一的问题是，当用户尝试滑动光标时，在用户释放鼠标按钮之前光标不会移动...

这里是出现问题的plunker（基于angular 4 plunker创建，我手动添加了material和cdk）： http://embed.plnkr.co/3s5K6U1YEsuTmO0q4aFt

这是另一个没有问题的 plunker（从已经实现 material 和 cdk 的 plunker 创建）： http://embed.plnkr.co/KHho3wSZGxAuEJdOwxz1 （原始插件是 o077B6uEiiIgkC0S06dd。我没有足够的声誉来发布两个以上的链接。）

我不知道这两个傻瓜之间有什么区别...

以下是我在本地项目中使用的软件包版本：

@angular/cli: 1.2.7
node: 6.11.2
os: linux x64
@angular/animations: 4.3.3
@angular/cdk: 2.0.0-beta.8
@angular/common: 4.3.3
@angular/compiler: 4.3.3
@angular/core: 4.3.3
@angular/forms: 4.3.3
@angular/http: 4.3.3
@angular/material: 2.0.0-beta.8
@angular/platform-browser: 4.3.3
@angular/platform-browser-dynamic: 4.3.3
@angular/router: 4.3.3
@angular/cli: 1.2.7
@angular/compiler-cli: 4.3.3
@angular/language-service: 4.3.3

Answer 1

您缺少 hammer.js 参考，这使得滑动行为

src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.min.js"

在您的 index.html 中参考此脚本。这将解决您的问题

来源：文档有以下几点

Answer 2

您已经有了答案，但另一种解决方案是将 hammerjs 添加到 package.json:

npm --save install hammerjs

并在 polyfill.ts 中添加：

import 'hammerjs';

Angular 4 material: md-slider 滑动不流畅

Angular 4 material: md-slider not smoothly slide

angular-material2

angular