在Angular中，当使用观察者模式来监听数据的更改时，有时候更改不会自动更新GUI。这通常是因为Angular的变更检测机制无法自动检测到这些更改。为了解决这个问题，可以使用ChangeDetectorRef来手动触发变更检测。

下面是一个示例代码，演示如何使用ChangeDetectorRef来解决此问题：

import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-example',
  template: `
    
{{ data }}
    Change Data
  `
})
export class ExampleComponent implements OnInit {
  data: string;

  constructor(private cdr: ChangeDetectorRef) {}

  ngOnInit() {
    this.observeData().subscribe(data => {
      this.data = data;
      this.cdr.detectChanges(); // 手动触发变更检测
    });
  }

  observeData(): Observable {
    // 模拟观察者模式，返回一个Observable
    return new Observable(observer => {
      setTimeout(() => {
        observer.next('New Data');
      }, 1000);
    });
  }

  changeData() {
    // 模拟数据的更改
    this.data = 'Updated Data';
    this.cdr.detectChanges(); // 手动触发变更检测
  }
}

在上面的代码中，我们使用ChangeDetectorRef的detectChanges方法手动触发了变更检测。在observeData方法中，当观察到数据更改时，我们更新了data变量，并且手动触发了变更检测。同样，在changeData方法中，当我们手动更改了data变量时，也手动触发了变更检测。

通过这种方式，我们可以确保当数据更改时，Angular会正确地更新GUI。