无法读取未定义的 属性 'unsubscribe'(rxJS - 订阅)
Cannot read property 'unsubscribe' of undefined (rxJS - Subscription)
我正在尝试掌握 rxJS 中的订阅和可观察对象。
我想通过取消订阅来更改 Observable 的间隔,然后使用新的间隔设置重新订阅。
应该很简单,但由于我是这方面的初学者,所以可能需要一些帮助。
看到这个plunk
export class AppComponent implements OnInit {
title = 'Observable Interval - Changing interval';
currentTime: any;
refreshInterval: number = 1000;
private subscription: Subscription;
constructor(private timeService: TimeService) {
}
clicked($event) {
console.log('new refreshInterval: ' + this.refreshInterval);
// Here I would like to unsubscribe to the subscription
// and then resubscribe using the new interval.
// However using below statement causes a
// TypeError: Cannot read property 'unsubscribe' of undefined
this.subscription.unsubscribe();
this.getTime();
}
// with this implementation changing the refreshInterval won't have any affect.
getTime() {
this.timeService.getTime(this.refreshInterval)
.subscribe(t => {
this.currentTime = t;
}
);
}
ngOnInit() {
this.subscription = this.getTime();
console.log(this.subscription);
console.log('refreshing each ' + this.refreshInterval + ' ms');
}
}
您需要return在getTime
方法中订阅:
getTime() {
return this.timeService.getTime(this.refreshInterval) // <-----
.subscribe(t => {
this.currentTime = t;
}
);
}
在您的情况下,return什么也没有。这就是为什么你有一个未定义的错误...
我正在尝试掌握 rxJS 中的订阅和可观察对象。
我想通过取消订阅来更改 Observable 的间隔,然后使用新的间隔设置重新订阅。
应该很简单,但由于我是这方面的初学者,所以可能需要一些帮助。
看到这个plunk
export class AppComponent implements OnInit {
title = 'Observable Interval - Changing interval';
currentTime: any;
refreshInterval: number = 1000;
private subscription: Subscription;
constructor(private timeService: TimeService) {
}
clicked($event) {
console.log('new refreshInterval: ' + this.refreshInterval);
// Here I would like to unsubscribe to the subscription
// and then resubscribe using the new interval.
// However using below statement causes a
// TypeError: Cannot read property 'unsubscribe' of undefined
this.subscription.unsubscribe();
this.getTime();
}
// with this implementation changing the refreshInterval won't have any affect.
getTime() {
this.timeService.getTime(this.refreshInterval)
.subscribe(t => {
this.currentTime = t;
}
);
}
ngOnInit() {
this.subscription = this.getTime();
console.log(this.subscription);
console.log('refreshing each ' + this.refreshInterval + ' ms');
}
}
您需要return在getTime
方法中订阅:
getTime() {
return this.timeService.getTime(this.refreshInterval) // <-----
.subscribe(t => {
this.currentTime = t;
}
);
}
在您的情况下,return什么也没有。这就是为什么你有一个未定义的错误...