Inject service TypeScript way

main.ts

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/bootstrap';
import {TodoService} from './TodoService';
import {TodoInput} from './TodoInput';

@Component({
    selector: 'app',
    directives: [TodoInput],
    template: `
        <todo-input></todo-input>
    `
})

class App {
    
}

// []: we can inject service which can be used for the whole app
bootstrap(App, [
    TodoService
]);

TodoInput.ts

import {Component} from 'angular2/core';
import {TodoService} from './TodoService';

@Component({
    selector: 'todo-input',
    template: `
        <div>
            <input #myInput type="text">
            <button (click)="onClick(myInput.value)">Click me</button>
        </div>
    `
})

export class TodoInput{

    constructor(public todoService: TodoService){

    }

    onClick(todo: string){
       this.todoService.todos.push(todo);
        console.log(this.todoService.todos);
    }
}

TodoService.ts

export class TodoService{
    todos = [];
}