角度9变量未在视图中更新
我的组件中有一个变量，它在使用console.log(variable)时正在更新--尽管它在我的视图中没有使用{{ variable }}更新--我尝试过几种方法，我的最后一种选择是使用Observers，但仍然不能正常工作。
我会解释我的代码：
所以我有一个服务，一个基本组件，一个应用程序组件&另一个组件
我的基本组件没有任何视图。它只实例化服务。就像这样：
private _communicationService: CommunicationService;
private _clientService: ClientService;
constructor(private injector : Injector) {
this.clientService = this.injector.get(ClientService);
}(包括gets和setter)
我的应用程序组件和另一个组件扩展了BaseComponent
我认为我的实现是错误的是下一件事：
我的应用程序组件正在调用window函数，我试图在ngInit上实现这些函数
export class AppComponent extends BaseComponent implements OnInit{
constructor(injector : Injector) {
super(injector);
}
ngOnInit(): void {
window.FlashExternalInterface.logLoginStep = (step : string) => {
this.clientService.loadClientProgress(step);
}
}
}我的“其他”组件：
export class LoaderComponent extends BaseComponent implements OnInit {
public progress = 0;
constructor(injector : Injector) {
super(injector);
}
ngOnInit(): void {
this.clientService.clientProgress.subscribe(data => {
console.log("Data Changing?: " + data);
this.progress = data;
console.log("Progress changing??" + this.progress);
});
}
}我的progress变量在F12控制台中确实有变化，但在视图中没有变化。
我尝试过使用{{ this.progress }}和不使用this.，甚至没有从Base clientService.clientProgress.getValue()调用直接服务实例
我的意思是，窗口函数在控制台上给了我一个错误，比如：
ERROR TypeError: Cannot set property 'logLoginStep' of undefined.但是，变量在控制台中确实会发生变化。控制台变量
回答 1
Stack Overflow用户
发布于 2020-08-04 11:46:54
这可能是一个异步问题，因为progress在subscribe()调用中被分配了一个值。在数据从客户端服务返回之前，progress不会被更新。
console.log工作的原因是因为它位于subscribe()块中，因此，根据定义，它是在等待服务在登录到控制台之前返回值。但是，指示您的HTML在页面加载后立即呈现progress的当前值。即使您的subscribe()是在ngOnInit()中调用的，服务返回更新的值仍然需要非零的时间，这已经太晚了。
在HTML中有几种处理此问题的方法
异步管道
<p>{{ progress | async }}<p>
这将监视更新的progress变量，并在值更新后直接将更改呈现给DOM；实际上与.subscribe()在.ts文件中所做的相同。
*ngIf
<p *ngIf="progress">{{ progress }}</p>
这根本不会呈现<p>，直到progress变量是真实的，即在本例中不是0、null或undefined。
https://stackoverflow.com/questions/63237945
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号