4,348
edits
add interaction
add array |
add interaction |
||
| Line 89: | Line 89: | ||
bootstrap(HelloWorld); | bootstrap(HelloWorld); | ||
</syntaxhighlight> | |||
adding interaction | |||
<syntaxhighlight lang="javascript"> | |||
/// <reference path="node_modules/anguar2/ts/typings/node/node.d.ts"/> | |||
/// <reference path="node_modules/anguar2/typings/browser.d.ts"/> | |||
import {bootstrap} from "angular2/platform/browser"; | |||
import {Component} from "angular2/core"; | |||
@Component({ | |||
selector: 'trainer', | |||
template: ` | |||
<form class="ui large form segment"> | |||
<h3 class="ui header">Add a Resource</h3> | |||
<div class="field"> | |||
<label for="title">Title:</label> | |||
<input type="text" name="title" #newtitle> | |||
</div> | |||
<div class="field"> | |||
<label for="link">Link:</label> | |||
<input type="url" name="link" #newlink> | |||
</div> | |||
<div class="field"> | |||
<label for="credit">Credit:</label> | |||
<input type="number" name="credit" #newcredit> | |||
</div> | |||
<button (click)="addArticle(newtitle,newlink)" class="ui positive right floated button">Submit resource</button> | |||
</form> | |||
` | |||
}) | |||
class TrainerApp { | |||
constructor() { | |||
} | |||
addResource(title: HTMLInputElement, link: HTMLInputElement): void { | |||
console.log(`Adding article title: ${title.value} and link: ${link.value}`); | |||
} | |||
} | |||
bootstrap(TrainerApp); | |||
</syntaxhighlight> | </syntaxhighlight> | ||