如何为订阅内的变量赋值？

Question

我有 Ionic 4 angular 项目，我需要在阅读内部订阅时赋值。但是我不能那样做。我知道有几个问题和答案与我的相关。但是 none 对我有用。这是我的代码，到目前为止我已经尝试过了。任何意见，任何帮助都适用。非常感谢。`

Service.ts

  public loggedChecker: any;
  private lofff = new Subject<any>();

    postLoginToServer (password, email) {
    var headers = new Headers();
    headers.append("Accept", 'application/json');
    headers.append('Content-Type', 'application/json' );
    let postData =  {
     password: password,
     mail: email
 }
 console.log("8888888888888888888888888888888");

    this.http.post("http://localhost:8080/api/login", postData, { observe: 'response'} )
      .pipe(map(data =>  this.loggedChecker =(data.body)));

      console.log(this.loggedChecker,"0330303333333333"); //undefined

      return this.loggedChecker+"";
}

这是我尝试的另一个

  postLoginToServer (password, email) {
    var headers = new Headers();
    headers.append("Accept", 'application/json');
    headers.append('Content-Type', 'application/json' );
    let postData =  {
     password: password,
     mail: email
 }
    this.http.post("http://localhost:8080/api/login", postData,{observe: 'response'})
      .subscribe(data => {
         
        this.loggedChecker =(data.body);
        
        this.textToDisplay = (data.body);
        this.lofff.next(data);
       }, error => {
        console.log(error);
      });

    console.log(this.lofff,"logged checker");
    
    return this.loggedChecker+"";
    }

这是page.ts

Page.ts

 logForm(){    
   
   console.log(this.fineService.postLoginToServer(this.passwordUser, this.email));
}

它们都不起作用。谢谢。

Answer 1

据我了解，您正在尝试分配一个名为 loggedChecker 的 class 属性。这是你应该做的：

  postLoginToServer (password, email) {
    var headers = new Headers();
    headers.append("Accept", 'application/json');
    headers.append('Content-Type', 'application/json' );
    let postData =  {
     password: password,
     mail: email
    }
    this.http.post("http://localhost:8080/api/login", postData,{observe: 'response'})
      .pipe(tap(data => {
        this.loggedChecker =(data.body);
        this.textToDisplay = (data.body);
        this.lofff.next(data);
       }, error => {
        console.log(error);
      }));
    }

tap(import from rxjs) 运算符不会更改数据，但可用于执行您正在尝试执行的操作。

更新： 您应该更改您的 logForm 函数。

 logForm(){    
   console.log(this.fineService.postLoginToServer(this.passwordUser, this.email));
}

应该是

     logForm(){    
       this.fineService.postLoginToServer(this.passwordUser, this.email).subscribe(data => {
        console.log(data);
       })
    }

因为 HTTP 请求将 return 一个可观察对象，您将在订阅它时获得它的值。

Answer 2

因为它是调用 post 请求时的回调函数，而且 JS 是非阻塞的。下面几行将在不等待订阅函数调用的情况下执行。因此你变得不确定。

尝试在订阅功能中进行控制台登录，或将服务功能设为异步，以便您的流程等待请求被处理。

如何为订阅内的变量赋值？

How to assign a value to variable inside subscription?

ionic-framework

angular

ionic4

Service.ts

Page.ts