加载并接收服务器响应后刷新元素

Question

此元素应在服务器响应div(*ngIf='IAmThatElement | async')后更新

组件

public IAmThatElement: boolean = false;
constructor(private returnAliveService: ReturnAliveService) {}
ngOnInit() {
this.calledWhenPageLoaded
}
//Not sure why there is a get. If the element is linked, should updating it not get reflected on view
get calledWhenPageLoaded() {
this.returnAliveService.getServerHealth()
.subscribe(data => {
this.IAmThatElement = data.resut;
}, error => {
this.IAmThatElement = false;
});
return this.IAmThatElement;
}

服务

@Injectable()
export class ReturnAliveService {
constructor(private http: HttpClient) {
}
getServerHealth() : Observable<Data> {
return this.http.get<Data>('URL');
}
}

我应该如何更新IAmThatElement。Angular的新手。发现了类似的东西https://stackoverflow.com/a/58652468仍然对我不起作用。非常感谢的帮助

----用Observable更新。不确定这是否有效，也不知道如何在更新后在视图中显示布尔值

public IAmThatElement: Observable<boolean> = new Observable<boolean>();
constructor(private returnAliveService: ReturnAliveService) {}
ngOnInit() {
this.returnAliveService.getServerHealth()
.subscribe(
data => {
//No idea on how to populate IAmThatElement with data and display content on view
this.IAmThatElement = Observable.create(true);
}
);
}

Answer 1

在代码中需要考虑两件事：

1.-我不知道为什么calledWhenPageLoaded方法之前有get。我会把它取下来。

2.-这是重要的一点：您已经在组件中声明IAmThatElement为布尔值，但在模板中绑定它时，您使用的是async管道，这意味着您订阅了一个可观察的，但这不是真的。所以你有两个选择：

• 从模板中删除| async管道
• 将IAmThatElement声明为可观察对象(例如BehaviourSubject(，并在calledWhenPageLoaded方法中更改其值

还要注意，在calledWhenPageLoaded方法中返回IAmThatElement没有效果。

例如：

import {BehaviorSubject} from 'rxjs';
public IAmThatElement: BehaviorSubject<boolean> = new BehaviorSubject(false);
constructor(private returnAliveService: ReturnAliveService) {}
ngOnInit() {
this.returnAliveService.getServerHealth()
.subscribe(
data => {                 
this.IAmThatElement.next(data.result); // I suppose `data.result` is a true value here
}, error => {
this.IAmThatElement.next(false);
});
}
);
}