Angular 2 ngModel no componente filho atualiza a propriedade do componente pai

Eu fiz uma interface simples que consiste em dois componentes (pai e filho).

O que a interface do usuário faz é que, quando digito algumas coisas na caixa de entrada do componente Filho. O valor será alterado usando ngModel.

O componente filho funciona bem dessa maneira.

// Child Component
@Component({
    selector: 'child',
    template: `
        <p>{{sharedVar}}</p>
        <input [(ngModel)]="sharedVar">
    `
})
export class ChildComponent {
    sharedVar: string;
}

Agora eu tenho um componente pai que pretendo usar o mesmo valor que o Componente Filho.

Adicionei o componente filho ao modelo pai e use a injeção de dependência para chamar o componente filhosharedVar.

// Parent Component
@Component({
    selector: 'parent',
    template: `
        <h1>{{sharedVar}}</h1>
        <child></child>
    `,
    directives: [ChildComponent],
    providers: [ChildCompnent]
})
export class ParentComponent {
    sharedVar: string;
    constructor(child: ChildComponent) {
        this.sharedVar = child.sharedVar;
    }
}

O problema é que, enquanto digito na caixa de entrada, o valor em<p>&nbsp;muda automaticamente enquanto o valor no componente pai<h1>&nbsp;não mude.