例外：观测量作业时，RxJS和Angular2 ObjectUnsubscribedError [英] Exception: ObjectUnsubscribedError when working with Observables with RxJS and Angular2

问题描述

我现在还在教自己Angular2（我真的需要找一些更​​好的资源），但我有一个问题。我提出我的数据调用一个服务，我使用的无主题＆安培;从朋友指令后BehaviorSubject。我的电话的作品，我有一个真正的后端，让我的数据对象（也就是模拟用户数据的oject），我的回答我在顶层的应用程序（称为应用程序但定义的类型相匹配的模拟REST服务。 TS），我必须等待响应。现在，这是我做错了什么，当我试图获得或我得到的数据工作 [例外：ObjectUnsubscribedError] 当我控制台。日志。

I am still trying to teach myself Angular2 (and I really need to find some better resources) but I have a question. I have moved my data calls to a service and I am using Reactive Subject & BehaviorSubject after instruction from a friend. My calls works, I have a mock REST service from a real back end that gives me a data object (that is an oject of mock user data), my response matches a type I have defined however in my top level app (called App.ts) I have to wait for the response. Now this is where I am doing something wrong as when I try to obtain or work with the data I get [Exception: ObjectUnsubscribedError] when I console.log.

这里的问题，这里是我的最高级别的应用程序

Here's the problem, here is my top level app

import {Component} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
import {Observable, Subject, BehaviorSubject} from 'rxjs';
import {UserContact, UserStatus} from './types/types';

// more stuff, then...

import {UserDataService} from './services/user-data/UserDataService';

@Component({
    selector: 'app',
    providers: [...FORM_PROVIDERS, UserDataService],
    directives: [...ROUTER_DIRECTIVES, FooterNavigation, TopNavigation, ContactsList],
    pipes: [],
    template: require('./app.html')
})

export class App {

    constructor(public userDataService: UserDataService) {
        console.log(this.userDataService.loginInUser.last());
    }

    ngOnInit() {
        // even if I try to output here I get the same problem
    }
}

下面是我的使用者资料

import {Injectable} from 'angular2/core';
import {UserStatus} from '../../types/types';
import {Subject, BehaviorSubject, Observable} from 'rxjs';
import {Http, Headers, Response} from 'angular2/http';

@Injectable()
export class UserDataService {

    public loginInUser: Subject<UserStatus> = new BehaviorSubject<UserStatus>(null);
    public currentUser: UserStatus;

    constructor(public http:Http) {
        this.loadUserStatus(); // Here I define the false user to use in my App
    }

    private loadUserStatus():void {
        var headers = new Headers();
        headers.append('Content-Type', 'application/json');
        this.http.get('/restservice/userstatus', {headers: headers}).subscribe((response:Response) => {
            var userStatus: UserStatus = new UserStatus(response.json());
            this.currentUser = userStatus;
            this.loginInUser.next(this.currentUser);
        }, (error:Response) => this.handleError, () => {
            this.loginInUser.complete();
        });
    }

从的console.log（this.userDataService.loginInUser.last（））的结果; 在App.ts给了我以下内容：

The results from the console.log(this.userDataService.loginInUser.last()); in the App.ts gives me the following:

_isScalar: false
completeSignal: false
destination: BehaviorSubject
dispatching: false
errorSignal: false
isUnsubscribed: false
observers: Array[0]
operator: LastOperator
source: BehaviorSubject
_hasError: false
_isScalar: false
_subscriptions: undefined
_value: UserStatus // the data does seem to be here!!!!
completeSignal: true
dispatching: false
errorSignal: false
isUnsubscribed: true
observers: undefined
value: [Exception: ObjectUnsubscribedError] // Here is the problem!!!!

我只希望我的App.ts接收返回的数据，一旦它准备好了，它显然没有更新......请告诉我什么，我对这个做错了我也高腰小时！

I just want my App.ts to receive the returned data once it is ready, it obviously isn't updating... please tell me what I am doing wrong I have waisted hours on this!

推荐答案

我要订​​阅 loginInUser 在当前用户更新观察到被通知：

I would subscribe to the loginInUser observable to be notified when the current user is updated:

constructor(public userDataService: UserDataService) {
  this.userDataService.loginInUser.subscribe(
    (currentUser) => {
      console.log(currentUser);
    }
  });
}

不要忘了一个HTTP请求是异步的，所以你可以在你的应用组件的构造函数执行后，接收数据。

Don't forget that an HTTP request is asynchronous so you can receive data after the constructor of your App component is executed.

这篇关于例外：观测量作业时，RxJS和Angular2 ObjectUnsubscribedError的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！