Question

我有用户数据服务。数据服务的目的是广播用户数据并在不同组件之间共享数据。如果一个组件对用户进行更改，则其他组件应该知道它。它在其他组件中工作正常。例如，我在位置组件中更新用户的位置，并且它在任何地方都可用。我有登录组件，我将用户凭据发送到API并接收用户数据。我将收到的数据分配给我的广播用户对象，但它没有反映在我的结帐组件中。

用户data.service.ts

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';

import {User} from '../entities/user';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class UserDataService {
  private _user: BehaviorSubject<User>;
  broadCastUser: Observable<User>;

  constructor() {
    this._user = new BehaviorSubject<User>(new User());
    this.broadCastUser = this._user.asObservable();
  }

  updateUser (newUser) {
    this._user.next(newUser);
  }
}

签in.component.ts

// removing unnecessary code
private _user: User;
ngOnInit() {

    // Getting user info so far
    this._userDataService.broadCastUser.subscribe(user => this._user = user);
}


signin () {
    const body = {
      UserId : this.emailAddress.value,
      Password : this.password.value
    };

    this._spinner.show();

    this._signInService.signIn(body).subscribe(
      (user) => {
        this._spinner.hide();

        // Handling error because API response is 200 Ok. Wrong API implementation.
        const userId = user[0].UserId;
        if (userId === 0) {
          this._isPasswordWrong = true;
        } else {
        this._user = user[0];
        this._user.isSignedIn = true;
        this._router.navigate(['/checkout']);
        }
      }
    );
  }

请注意登录方式 this._user = user [0]; 中的行。如果我在此行之后立即打印用户属性，那么我看到它们已更新。但是当我去结账组件时，它们不会更新。它们是旧值或未定义。

如果需要，我会提供所有代码。但感觉这已经足够了。

Answer 1

我不确定它是否是理想的解决方案，但应用程序正在以它应该工作的方式工作。

我在 sign-in .component.ts 中添加了私有更新方法，并在 signIn（） 代替 this._user = user [0];

我从@Leon的评论中得到了一个提示，并找到了解决方案。

signin () { const body = { UserId : this.emailAddress.value, Password : this.password.value }; this._spinner.show(); this._signInService.signIn(body).subscribe( (user) => { this._spinner.hide(); // Handling error because API response is 200 Ok. Wrong API implementation. const userId = user[0].UserId; if (userId === 0) { this._isPasswordWrong = true; } else { this.updateUser (user[0]); this._router.navigate(['/checkout']); } } ); }

新的更新（）

private updateUser (user: User) { let newUser = new User(); newUser = user; newUser.cart = this._user.cart; newUser.address = this._user.address; newUser.isSignedIn = true; this._userDataService.updateUser(newUser); }

我很开放，愿意接受更好的答案。如果我找到了，我会在这里发布。

当从api响应中分配数据时，BehaviorSubject不会更新

1 个答案: