docs(input): add example of a clearable input

Author: mmalerba

src/examples/example-module.ts

@@ -70,6 +70,7 @@ import {SelectOverviewExample} from './select-overview/select-overview-example';
 import {ChipsOverviewExample} from './chips-overview/chips-overview-example';
 import {ChipsStackedExample} from './chips-stacked/chips-stacked-example';
 import {SelectFormExample} from './select-form/select-form-example';
+import {InputClearableExample} from './input-clearable/input-clearable-example';
 
 
 export interface LiveExample {
@@ -121,6 +122,7 @@ export const EXAMPLE_COMPONENTS = {
   'grid-list-overview': {title: 'Basic grid-list', component: GridListOverviewExample},
   'icon-overview': {title: 'Basic icons', component: IconOverviewExample},
   'icon-svg': {title: 'SVG icons', component: IconSvgExample},
+  'input-clearable': {title: 'Input with clear button', component: InputClearableExample},
   'input-form': {title: 'Inputs in a form', component: InputFormExample},
   'input-overview': {title: 'Basic inputs', component: InputOverviewExample},
   'list-overview': {title: 'Basic list', component: ListOverviewExample},
@@ -192,6 +194,7 @@ export const EXAMPLE_LIST = [
   GridListOverviewExample,
   IconOverviewExample,
   IconSvgExample,
+  InputClearableExample,
   InputFormExample,
   InputOverviewExample,
   ListOverviewExample,

src/examples/input-clearable/input-clearable-example.css

@@ -0,0 +1,3 @@
+.example-input-container {
+  width: 200px;
+}

src/examples/input-clearable/input-clearable-example.html

@@ -0,0 +1,4 @@
+<md-input-container class="example-input-container">
+  <input mdInput type="text" placeholder="Clearable input" [(ngModel)]="value"/>
+  <md-icon mdSuffix *ngIf="value" (click)="value=''">close</md-icon>
+</md-input-container>

src/examples/input-clearable/input-clearable-example.ts

@@ -0,0 +1,11 @@
+import {Component} from '@angular/core';
+
+
+@Component({
+  selector: 'input-clearable-example',
+  templateUrl: './input-clearable-example.html',
+  styleUrls: ['./input-clearable-example.css'],
+})
+export class InputClearableExample {
+  value = 'Clear me';
+}