Angular RxJS ReplaySubject未更新角度区域

我有一个在服务上更新的ReplaySubject变量，组件正确地获取了新值，但是它似乎没有更新视图（HTML中的绑定保持为空，即使变量正确地更新）

服务：

export class ExampleService {
  myVariable;

  constructor(private http: HttpClient, private userModel: UserModel) { 
    this.myVariable = new ReplaySubject(1);

    this.getApiRoot(`/api/endpoint`)
    .subscribe(
      data => { 
        this.myVariable.next(data);
      },
      err => { 
        console.log(`Database connection error: ${err}`);
      },
      () => { }
    );
  }
}

组成部分：

从“./example.service”导入{ExampleService}； 导出类myComponent实现OnInit{

valueOnFrontend: string;

constructor(exampleService: ExampleService) {};

ngOnInit() {
    this.exampleService.myVariable.subscribe(
    function(value) {
        console.log(this.valueOnFrontend);
        this.valueOnFrontend = value;
    },
    function(error) {
        console.log(err);
    },
    function() {
        console.log("Request completed.");
    }

) } }

ExampleService

的HTML如下所示：

{{ valueOnFrontend }}

因此，值在服务中被正确更新，然后被正确地发送到组件，组件中的

控制台.log

记录新值，但是HTML绑定没有得到更新

我读到RxJS在它自己的区域中运行，而Angular区域不知道其中的更新。如何修复此问题，并在HTML中获取要更新的值

---

谢谢P

组件中的subscribe回调应使用fat箭头指示正确的范围

this.exampleService.myVariable.subscribe( 
  (value: any) => { 
    console.log(this.valueOnFrontend);
    this.valueOnFrontend = value; 
  }, 
  (error: any) => { 
    console.log(err); 
  }, () => { 
    console.log("Request completed."); 
  }
);

---

您是否可以选择通过模板中的异步管道访问observable

exampleService.myVariable

，而不订阅代码隐藏？比如：

{{exampleService?.myVariable | async}}

---

“this.valueOnFrontend=value；”此引用是组件对象吗？@ABOS是的，没错。这是前端变量的值。显然不是，正如您在下面回答的。在回调中始终注意“this”的范围。啊，我的印象是我引用了正确的变量，但范围是错误的。现在我明白你的问题了。干杯，对你有用吗？如果不使用组件元数据更新您的问题：O它起作用了。我甚至没有想到JavaScript的作用域，读了很多关于区域和其他东西的书。干杯：）除非您不改变changedetection上的策略a.k.a ZoneJ的默认cd检查组件发生情况明白了。谢谢你的解释和帮助：）np！很高兴它有帮助！