Question

所以我有一个基本组件，其中我在其构造函数中有一个observable，一旦在另一个将验证用户数据的组件中收到一个值。但是，当尝试在子类中获取此值时，数据将以未定义的形式到达。在代码下面我遇到了问题：

我的观察：

@Injectable()
export class ObservableUsuario implements ObservableUtil {
    subject = new Subject<any>();
    setUsuario(variable: any) {
        this.subject.next({ text: variable });
    }

    clearUsuario() {
        this.subject.next();
    }

    getUsuario(): Observable<any> {
        return this.subject.asObservable();
    }

此处observable已设置：

 getValue = (refresh: boolean = true) => cacheable(
    () => this.http.get(`${environment.apiEndpoint}/api/Get/Value`, headers()).map(res => {
      this.observableUser.setUsuario(res.json());
      return res.json();
    }),
  );

基础组件：

//more code
       perfilLotado: any;
        constructor(
            public observableUser: ObservableUsuario
        ) {
            this.observableUser.getUsuario().subscribe(
                perfil => this.perfilLotado = perfil.text.lotacaoDTO[0].perfilDTO[0].nome);
        }
//more code

子组件：

   export class BaseListComponent extends BaseComponent {

        NgOnInit(){}

        validAction(situacao: number): any {
//Here appearer like undefined...
            console.log(this.perfilLotado);
            if (this.sistema.situacaoRestric[situacao] != undefined) {
                this.showMsg('warn', 'Mensagem de Alerta', this.sistema.situacaoRestric[situacao]);
                return false;
            } else if (this.sistema.situacaoRestric[situacao] == undefined && this.sistema.perfilRestrict[this.perfilLotado] != undefined) {
                this.showMsg('warn', 'Mensagem de Alerta', this.sistema.perfilRestrict[this.perfilLotado]);
                return false;
            } else if (this.sistema.situacaoRestric[situacao] == undefined && this.sistema.perfilRestrict[situacao] == undefined) {
                return true;
            }
        }

换句话说，我的问题是加载我的observable传递给子组件类的值。注意：根据我的理解，它是最后一个要加载的组件，如何在屏幕的其他组件之前加载它？

Answer 1

根据您的描述，您的问题是，您订阅了该服务并且并行尝试从构造函数中填写数据。你在某种竞争条件下奔跑。我亲自测试过。如果您从构造函数中订阅但是从ngOnInit（）中调用服务的setUsuario（） - 方法，则在调用validAction（）时，这将足以使您的值存在。

这个缩短版的代码可以正常工作，因为订阅发生在构造函数中，并且＆＃34;填充＆＃34;后来在ngOnInit（）：

private perfilLotado: any;

constructor(private observableUsuario: ObservableUsuario) {
    this.observableUsuario.getUsuario().subscribe(
        perfil => {
            this.perfilLotado = perfil;
        });
}

ngOnInit(): void {
    this.observableUsuario.setUsuario('TEST');
}

Answer 2

是的，或多或少相同的是，在执行这部分代码之前数据已经填满，所以我只能在执行完所有代码后才能捕获它。然后我能够使用BehaviorSubject解决，将其与其他Subject无服务一起设置。因为我需要两个不同的点，但作为一个错误，我将不得不离开，直到我解决问题。

按照我在observable中使用的代码：

@Injectable()
export class bObservableUsuario {

  private messageSource = new BehaviorSubject<any>("");
  currentMessage = this.messageSource.asObservable();

  constructor() { }

  changeMessage(obj: any) {
    this.messageSource.next(obj)
  }

服务：

  GetData = (refresh: boolean = true) => cacheable(
    () => this.http.get(`${environment.apiEndpoint}/api/get/data`, headers()).map(res => {
//for now i need two observers here :(..
      this.observableUser.setUsuario(res.json());
//this bObservable solve my problems
      this.bObservable.changeMessage({obj: res.json()});
      return res.json();
    }),

组件子：

@Component({ template: '' })
export class BaseListComponent extends BaseComponent {
    init() {
        this.bObservale.currentMessage.subscribe(d => this.perfilLotado = d.obj);

    }
///more code

将Observable的值传递给Base Component中的变量到子组件 - Angular 5

2 个答案: