Angular 7中public变量赋值后始终为undefined的问题求助

你的问题核心在于HTTP请求是异步操作，而你当前的代码逻辑没有考虑这一点：

当你调用this.http.post(...).subscribe(...)时，浏览器只是发送了HTTP请求，代码会立刻继续执行后面的return this.status——这时候请求还没完成，res还没返回，this.status自然还是初始的undefined，所以返回的值永远不对。

下面给你两种常见的解决思路：

方案1：返回Observable（推荐，符合Angular的异步编程风格） #

修改signin方法，让它直接返回HTTP请求的Observable，把订阅的逻辑交给调用方处理，同时可以用tap操作符来更新this.status：

import { Observable, tap, catchError, throwError } from 'rxjs';

// 先确保signinData类型是定义好的，比如：
interface SigninData {
  email: string;
  password: string;
}

signin(signinData: SigninData): Observable<any> {
  const obj = { username: signinData.email, password: signinData.password };
  
  return this.http.post("http://localhost:8080/fishproduct/login/", obj).pipe(
    tap(res => {
      console.log(res["returnFlag"]);
      this.status = res["returnFlag"];
      console.log(this.status);
    }),
    catchError(err => {
      console.log(err);
      // 可以在这里处理错误，比如返回默认状态或者抛出错误
      return throwError(() => new Error('登录请求失败'));
    })
  );
}

调用这个方法的时候，在组件里订阅就能拿到正确的结果：

this.yourService.signin(yourSigninData).subscribe({
  next: (res) => {
    // 这里可以拿到res.returnFlag，或者直接用service里的this.status
    console.log('登录状态:', this.yourService.status);
  },
  error: (err) => {
    // 处理错误情况
  }
});

方案2：使用async/await转成Promise #

如果你更习惯Promise的写法，可以把Observable转成Promise，用async/await来等待请求完成：

import { lastValueFrom } from 'rxjs'; // Angular 12+推荐用lastValueFrom代替toPromise

interface SigninData {
  email: string;
  password: string;
}

async signin(signinData: SigninData): Promise<any> {
  const obj = { username: signinData.email, password: signinData.password };
  
  try {
    const res = await lastValueFrom(this.http.post("http://localhost:8080/fishproduct/login/", obj));
    console.log(res["returnFlag"]);
    this.status = res["returnFlag"];
    console.log(this.status);
    return this.status;
  } catch (err) {
    console.log(err);
    throw err; // 或者返回错误状态，比如return false
  }
}

调用的时候需要用await，并且调用的函数也要标记为async：

async handleLogin() {
  try {
    const status = await this.yourService.signin(yourSigninData);
    console.log('登录状态:', status);
  } catch (err) {
    // 处理错误
  }
}

总结一下：异步操作不能直接同步返回结果，必须等到异步任务完成后才能拿到正确的值，上面两种方案都是让代码等待请求完成后再处理返回值，解决你当前的undefined问题。

内容的提问来源于stack exchange，提问作者K Rajitha