user input formatting

This commit is contained in:
Alex Wolfe 2015-04-22 07:21:09 -07:00
parent b66786ed55
commit 345a013156
1 changed files with 99 additions and 97 deletions

View File

@ -1,7 +1,7 @@
.statement
h4 Live Examples
p.
If you want to skip to the working examples you can check out these links on Plunker. <a href='http://plnkr.co/edit/htvpvg2RxemT2W0mYu0y?p=preview')> TypeScript Example</a> or <a href='http://plnkr.co/edit/sjRKtQd10ARLM2GTsQKi?p=preview> ES5 Example</a>.
If you want to skip to the working examples you can check out these links on Plunker. <a href='http://plnkr.co/edit/htvpvg2RxemT2W0mYu0y?p=preview')> TypeScript Example</a> or <a href='http://plnkr.co/edit/sjRKtQd10ARLM2GTsQKi?p=preview'> ES5 Example</a>.
.l-main-section
h2#section-responding-to-user-input Responding to user input with event syntax
@ -31,7 +31,7 @@
event. And the <code>{{myname.value}}</code> binds the text node of the <code>&lt;p&gt;</code> element to the
input's value property.
p Let's do something a little more complex where users enter items and add them to a list like this:
div(align='center')
figure.image-display
img(src='user-input-example1.png')
@ -42,7 +42,8 @@
list. Inside the controller, add an array with an initial list of items. Then add a method that pushes new items
on the array when called.
pre.prettyprint.linenums.lang-javascript
.code-box
pre.prettyprint.linenums.lang-javascript(data-name="es5")
code.
//ES5
function TodoList() {
@ -52,7 +53,7 @@
};
}
pre.prettyprint.linenums.lang-typescript
pre.prettyprint.linenums.lang-typescript(data-name="typescript")
code.
//TypeScript
class TodoList {
@ -116,7 +117,8 @@
.l-main-section
h2#section-final-code Final Code
pre.prettyprint.lang-javascript
.code-box
pre.prettyprint.lang-javascript(data-name="es5")
code.
//ES5
function TodoList() {
@ -155,7 +157,7 @@
angular.bootstrap(TodoList);
});
pre.prettyprint.lang-typescript
pre.prettyprint.lang-typescript(data-name="typescript")
code.
//TypeScript
import {Component, View, bootstrap, For, If} from 'angular2/angular2';