app.ts

/**
 * A basic hello-world Angular 2 app 
*/
import { NgModule, Component } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic"; 

@Component({
    selector:'reddit-article',
    host: {
        class: 'row'
    },
    template: `
        <div class="four wide column center aligned votes">
            <div class="ui statistic">
                <div class="value"> {{votes}} </div>
                <div class="label"> Points </div>
            </div>
        </div>
        <div class="twelve wide column"> 
            <a class="ui large header" href="{{ link }}">  {{ title }} </a>
            <ul class="ui big horizontal list voters"> 
                <li class="item"> 
                    <a href (click)="voteUp()">
                        <i class="arrow up icon"></i> Upvote 
                    </a>
                </li>
                <li class="item">
                    <a href (click)="voteDown()">
                        <i class="arrow down icon"></i> Downvote
                    </a>
                </li>
            </ul>
        </div>
    `
})
class ArticleComponent {
    votes: number
    title: string;
    link: string;

    constructor(){
        this.votes = 10;
        this.title = 'Angular 2';   
        this.link = 'http://angular.io'; 
    }

    voteUp(){
        this.votes +=1;
        return false;
    }

    voteDown(){
        this.votes -=1;
        return false;
    }
}


@Component({
    selector: 'reddit',
    template: `
        <form class="ui large form segment middle">
            <h3 class="ui header">Add a Link</h3>

            <div class="field">
                <label for="title">Title:</label>
                <input name="title" #newtitle>
            </div>

            <div class="field">
                <label for="link">Link:</label>
                <input name="link" #newlink>
            </div>

            <button (click) = "addArticle(newtitle, newlink)" class="ui positive right floated button">Submit</button>

        </form>
        <div class="ui grid posts"> 
            <reddit-article> </reddit-article> 
        </div>
    `
})
class RedditApp { 
    addArticle(title: HTMLInputElement, link: HTMLInputElement): boolean{
        console.log(`Adding article title: ${title.value} and link: ${link.value} `);
        return false;
    }
}

@NgModule({
  declarations: [RedditApp, ArticleComponent ],
  imports: [BrowserModule],
  bootstrap: [RedditApp]
})
class RedditAppModule {}

platformBrowserDynamic().bootstrapModule(RedditAppModule);

// your code goes here