Solvedcomponents Can't drag md-slider

Bug, feature request, or proposal:

Looks like a bug, but it could be user error (I'm new to Material)

What is the expected behavior?

Should be able to drag on md-slider

What is the current behavior?

Drag doesn't work, though click on slider does set the value

What are the steps to reproduce?

Please check out http://ravinutala.com/d/index.html for an example with just the slider

What is the use-case or motivation for changing an existing behavior?

Just want the correct behavior, not asking for any changes

Which versions of Angular, Material, OS, browsers are affected?

Angular 4.0.3, Material 2.0.0-beta.3, Windows 10, Chrome/FF (only tested on these two)

Is there anything else we should know?

The import order solution never worked for me, though it does seem to be related to something overriding Hammer gestures. I was able to get it working with the following in app module.

import { BrowserModule, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
import { GestureConfig, MaterialModule } from '@angular/material';

// Angular material has a bug with the import order of browserModule and angular material which causes Hammger gestures to get overridden.
@NgModule({
  providers: [
    { provide: HAMMER_GESTURE_CONFIG, useClass: GestureConfig }
  ]
});

Hi, I just wanted to point out that I found out another weird behavior.
In order to make md-slider work together with hammerjs inside a lazy loaded module, I have to import MdSliderModule both in the main App.module and in the Lazy.module. This is a wasteful import since I only use MdSliderModule inside the LazyModule.

You need to import MaterialModule after either BrowserAnimationsModule or BrowserModule (probably just best to put it after both).

Unfortunately, I couldn't tell you why

Alright, here is what worked for me, in my app.module.ts

I can scroll, and I can slide. Angular/Material 5.1.1 and Hammer 2.0.8.

THE KEY: Use GestureConfig which comes with Material as it seems to be what Angular Material
uses as a default, so that's what needs to be your starting point, not HammerGestureConfig.

import 'hammerjs';
import { BrowserModule, HAMMER_GESTURE_CONFIG } from '@angular/platform-browser';
import { GestureConfig } from '@angular/material';

declare var Hammer: any;
@Injectable()
export class HammerConfig extends GestureConfig  {
  buildHammer(element: HTMLElement) {
    return new GestureConfig({touchAction: 'pan-y'}).buildHammer(element);
  }
}

...

@NgModule({
  declarations: [ ...  ],
  imports: [ 
    BrowserModule,
    MatSliderModule,
    BrowserAnimationsModule
    ...
  ],
  entryComponents: [ ... ],
  providers: [
    {
      provide: HAMMER_GESTURE_CONFIG,
      useClass: HammerConfig
    }
  ]
...

I had the same issue.
What I did was:

1. check if I installed @angular/animations
2. check if I installed hammerjs
3. check if I included BrowserAnimationsModule before the MatSliderModule
4. check if I imported hammerjs at application root -> I didn't do that and once I imported it, it worked. (https://material.angular.io/guide/getting-started#step-5-gesture-support)