ngStyleがAngularで働いていない

Question

私はAngularを学んでいます。私はチュートリアルで - Angular 2 Component Interaction - Extended Components Example

私は色のオプションをクリックしてテキストの色を変更しようとしています。ここで私はapp.component.tsに持っているものである -

 import { Component, Output, EventEmitter, Input } from '@angular/core'; 

@Component ({ 
    selector:'my-app', 
    template:`<div class='color-picker'> 
    <div class="color-title" [ngStyle]="{'color':color}">Pick a color</div> 
    <div class='color-picker-wrp'> 
    <div class='color-sample color-sample-blue' (click)="choose('blue')" ></div> 
    <div class='color-sample color-sample-red' (click)="choose('red')" ></div> 
    </div> 

</div>` 
, 
styleUrls:['picker.css'] 
}) 
export class AppComponent { 
    @Input() 
    color:string; 

    @Output("color") 
    colorOutput = new EventEmitter(); 

    choose(color:string) 
    {  
    this.colorOutput.emit(color); 
    console.log(color); 
    } 
} 

私はplunkerを作成している - https://plnkr.co/edit/ryvw9W220EvLxMSqCCh8?p=preview

色がタイトルに適用されていない - しかし、それが正しく、コンソールに記録され、色を選択。 関連記事を読んだ後、私はこの仕事をすることができませんでした。

Answer 1

私は以下のようにchooseの機能を変更するには、色付きのdivのクリックでテキストPick a colorの色を変更したいと思う：

choose(color:string) {  
    this.colorOutput.emit(color); 
    this.color= color; 
    console.log(color); 
} 

を