components: Slide Toggle Doesn't Seem to be working in Alpha 7 Error: Cannot find name 'HammerInput'

For those finding this issue that have a similar configuration to mine: angular-material: 2.0.0-alpha.7-3 angular-cli: 1.0.0-beta.11-webpack.2

Just doing the following: $ npm install --save hammerjs @types/hammerjs

Was all that was needed. Since my tsconfig.json file contains this line: "typeRoots": [ "../node_modules/@types" ]

I did not have to make any changes to main.ts

Using angular-cli@latest (webpack)

I added hammerjs

npm install --save hammerjs @types/hammerjs

then on the last line of src/polyfills.ts I added import 'hammerjs';

Install hammerjs and its typings. With alpha7, angular2 rc5, typescript 2.0 and webpack (through angular-cli) this worked for me:

npm install --save hammerjs @types/hammerjs

And then import 'hammerjs' in your main component.

Seems like you didn’t load the HammerJS library

import 'hammerjs'; // Recommended

or

<!-- Not recommended when using Webpack -->
<script src="./node_modules/hammerjs/hammer.js">

In addition to ctkdev’s solution I had to add hammerjs to the “types” section in tsconfig.json

“types”: [ “jasmine”, “hammerjs” ]

Thank you everyone installing typings through command:

npm install --save hammerjs @types/hammerjs

and then importing it in main file solved the issue.:

/// <reference path="../typings/globals/hammerjs/index.d.ts" />

I guess you didn’t install the typings for HammerJS?

https://github.com/angular/material2/blob/master/GETTING_STARTED.md#additional-setup-for-md-slide-toggle-and-md-slider

typings i dt~hammerjs --global --save

I had to use I had to use @ctkdev and @uncledlm and @DevVersion solutions =D

I did the import in polyfills.ts (using angular-cli webpack)

@vapits No worries - glad I could help 😃

I had to use @ctkdev and @uncledlm solutions. Now everything is working fine 👍

@naveedahmed1 installing the typings for HammerJS should resolve this.