Angular 如何应对角度变化<;2.x可观测
我有一个数据服务组件,用于在几个组件之间共享BehaviorSubject类变量 我已将服务设置为:Angular 如何应对角度变化<;2.x可观测,angular,rxjs,onchange,Angular,Rxjs,Onchange,我有一个数据服务组件,用于在几个组件之间共享BehaviorSubject类变量 我已将服务设置为: import { Injectable } from '@angular/core'; import { Observable } from 'rxjs/Observable'; import { BehaviorSubject } from 'rxjs'; @Injectable() export class SharedStateService { private selectedYe
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { BehaviorSubject } from 'rxjs';
@Injectable()
export class SharedStateService {
private selectedYearMo = new BehaviorSubject('2018-11');
yearmo = this.selectedYearMo.asObservable();
constructor() { }
changeYearmo(yearmo: string) {
this.selectedYearMo.next(yearmo);
this.yearmo = this.selectedYearMo.asObservable();
console.log("yearmo change request recieved at service");
console.log("yearmo changed: ", this.yearmo);
}
getYearmo(){
return this.yearmo;
}
}
每个组件实现对可观察对象的订阅,如下所示:
...
constructor(private sharedStateService: SharedStateService) {
};
...
getYearMo(): void {
this.sharedStateService.getYearmo().subscribe(
(yearmo: any) => {
console.log("BehaviourSubject test received "+yearmo+" at component.");
this.cd.markForCheck();
}
);
}
...
ngOnInit() {
this.getYearMo();
this.getData();
};
...
ngOnChanges(changes: SimpleChanges) {
console.log("detected changes...");
for (let propName in changes) {
let change = changes[propName];
let curVal = JSON.stringify(change.currentValue);
let prevVal = JSON.stringify(change.previousValue);
console.log(curVal);
console.log(prevVal);
}
};
...
现在,当可观察到的更改时,getYearmo中定义的日志消息在组件处按预期显示behavior subject test received“+yearmo+”
,但从未调用ngOnChanges()
方法。但是,我希望有一种方法可以在适当的生命周期钩子中处理这类事情,比如ngOnChanges()
,因为最终我可能希望有多个订阅
有没有其他方法来应对我所忽略的可观察事物的变化?这似乎是一件很常见的事情,但从我迄今为止所接触到的资源来看,我很难理解。我认为你对
可观测的反应性和ngOnChanges
的生命周期挂钩感到困惑
ngOnChanges
-,是一个生命周期钩子,也称为回调函数,如果您有任何数据绑定的输入属性,则将调用该回调函数,也就是说,在您的数据库中使用@input
修饰的属性。它从不用于检测观测值的任何变化
当角度(重新)设置数据绑定输入属性时响应。该方法接收包含当前和以前属性值的SimpleChanges对象
在ngOnInit()之前以及当一个或多个数据绑定输入属性更改时调用
假设您是(可以看出您的代码几乎与文档的示例一样精确),您可以看到他们的代码具有使用@Input
修饰的属性
@Input() hero: Hero;
@Input() power: string;
这两个属性实际上是通过数据绑定“传递”到组件中的,使用方括号:
<on-changes [hero]="hero" [power]="power"></on-changes>
因此,不,ngOnChanges
不是您想要编写代码以对可观察到的更改作出反应的地方。您可以编写代码来对@输入的更改作出反应Observable
的subscribe
已经存在,您可以在Observable
发出发射时实现您想要的任何功能。要订阅您的Observabels
,是的,这是作为ngOnInit
生命周期钩子进行操作的最佳地方。这是一个很好的洞察。一开始理解可观测数据相对于其他数据共享选项的作用是令人困惑的。