Представление Angular 2 не обновляется после обновления свойства через тему

Question

Я устанавливаю цвет фона для динамического обновления div, назначая свойство style.background-color, как показано ниже.

<div [style.background-color]="cellColor">
  <span>{{ cellColor }}</span>
</div>

В его машинописном файле я назначил цвет по умолчанию, который был успешно установлен. Позже я изменяю значение свойства cellColor, подписываясь на Subject в жизненном цикле ngOnInit() файла компонента, как показано ниже.

Внутри Сервисного определения.

@Injectable()
export class StyleService {
  editClicked = new Subject();
  constructor() { }
}

Из другого компонента я добавляю новое значение для свойства "cellColor" следующим образом.

this.styleService.editClicked.next('white');

Затем я подписываюсь на тему из файла ts моего компонента, как это.

ngOnInit() {
    this.styleService.editClicked.subscribe(
      (color : string) => {
        this.cellColor = color;
        console.log(this.cellColor);
      }
    )
  }

Свойство было успешно обновлено, хотя представление не обновлялось. Я уже связываю свойство стиля моего div, используя скобки [], как показано выше, тогда почему бы не обновить представление? Я что-то здесь упускаю?

Однако для того же примера, если я подписываюсь, используя Observable, свойство изменяется, и представление также обновляется.

ngOnInit() {
     Observable.of(true)
      .delay(2000)
      .subscribe((success) => {
        if(success){
          console.log('Pretend loading: success!');
          this.cellColor = 'white';
          this.cdr.markForCheck();
        }
      });
}

Почему это будет работать при подписке на Observable, а не на Subject?