feat(material): early version of md-input

Closes #1753
This commit is contained in:
Jeremy Elbourn
2015-05-07 09:10:41 -07:00
committed by Misko Hevery
parent 31cbec0857
commit ad23921814
4 changed files with 152 additions and 17 deletions

View File

@ -1,10 +1,43 @@
<style>@import "angular2_material/src/components/input/input.css";</style>
<div md-theme="default">
<style>
body {
max-width: 500px;
}
</style>
<div>
<h2>input demo</h2>
<h3>Normal input</h3>
<md-input-container>
<label>Name</label>
<input>
<input md-input>
</md-input-container>
<h3>Pre-filled value</h3>
<md-input-container>
<label>Favorite Framework</label>
<input value="Angular">
</md-input-container>
<h3>Disabled input</h3>
<md-input-container>
<label>ID Number</label>
<input disabled>
</md-input-container>
<h3>Disabled, pre-filled input</h3>
<md-input-container>
<label>Best TV show</label>
<input disabled value="Firefly">
</md-input-container>
<h3>textarea</h3>
<md-input-container>
<label>What I did on my summer vaccation</label>
<textarea></textarea>
</md-input-container>
</div>

View File

@ -4,12 +4,11 @@
<meta charset="UTF-8">
<title>ng-material input demo</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:400,500,700,400italic">
<style> * { font-family: RobotoDraft, Roboto; } </style>
<style> * { font-family: RobotoDraft, Roboto; }
</style>
</head>
<body>
<demo-app>Loading...</demo-app>
$SCRIPTS$
</body>
</html>

View File

@ -1,5 +1,5 @@
import {bootstrap} from 'angular2/angular2';
import {MdCheckbox} from 'angular2_material/src/components/checkbox/checkbox'
import {MdInputContainer, MdInput, MdTextarea} from 'angular2_material/src/components/input/input'
import {UrlResolver} from 'angular2/src/services/url_resolver';
import {commonDemoSetup, DemoUrlResolver} from '../demo_common';
import {bind} from 'angular2/di';
@ -14,17 +14,11 @@ import {View} from 'angular2/src/core/annotations_impl/view';
})
@View({
templateUrl: './demo_app.html',
directives: [MdCheckbox]
directives: [MdInputContainer, MdInput, MdTextarea]
})
class DemoApp {
toggleCount: number;
constructor() {
this.toggleCount = 0;
}
increment() {
this.toggleCount++;
}
}