Angular 未触发角度订阅功能

我有一个“登录组件”，它将变量初始化为：

  ngOnInit() {
    console.log("at ngOnInit");
    this.httpClientService.getUsers().subscribe(
      response =>{
        console.log("at subscribe");
        this.handleSuccessfulResponse(response);
      }
    );
    console.log(this.Users);
  }

  handleSuccessfulResponse(response)
  {   
    console.log("handle");
    this.Users=response;
    console.log(this.Users);
  }

getUsers（）功能如下：

  getUsers()
  { console.log("at  getUsers");

    return this.httpClient.get<User[]>('http://localhost:8080/findalluser');
  }

除了错误“this.Users是不可编辑的”之外，没有其他错误，这是合理的，因为this.Users是未定义的。显然，“subscribe（）”函数没有被触发，或者httpClient根本没有返回可观察的。我不明白为什么

更新：

这是全部服务代码-

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { HttpHeaders } from '@angular/common/http';
import { HttpClientTestingModule } from '@angular/common/http/testing';


import { stringify } from '@angular/compiler/src/util';

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Authorization': 'my-auth-token'
  })
};

export class Employee{
  constructor(
    public empId:string,
    public name:string,
    public designation:string,
    public salary:string,
  ) {}
}


export class User{
  constructor(
    public id:String,
    public username:string,
    public password:string,

  ) {}
}

export class UssdFiles{
  constructor(
    public filename:string,
    public filepath:string,
  ) {}
}

export class SmsFiles{
  constructor(
    public filename:string,
    public filepath:string,
  ) {}
}

export class Data{
  constructor( public flines: String )
  {}
}

export interface Post{
  id: number;
  userId: string;
  body: string;
  title: string;
}

@Injectable({
  providedIn: 'root'
})

export class HttpClientService {

  constructor(private httpClient:HttpClient) { }

  getUsers()
  {   console.log("getUsers");
    return this.httpClient.get<User[]>('http://localhost:8080/findalluser');
  }

  getUssdFiles(){
    return this.httpClient.get<UssdFiles[]>('http://localhost:8080/findallussd');
  }

  getSmsFiles(){
    return this.httpClient.get<SmsFiles[]>('http://localhost:8080/findallsms');
  }

  getFileData(file:String){
    //const str = JSON.stringify(this.httpClient.get<Data>('http://localhost:8080/getfiledata/'+file));
    return this.httpClient.get<Data>('http://localhost:8080/getfiledata/'+file);
  }

  postFileData(fileData:Object){
    console.log("!!!!!!!!!!!!!!!!!!!!!!!!!!!!")
    console.log(fileData)
    return this.httpClient.post<Object>('http://localhost:8080/updatedfiledata',fileData).subscribe(response =>{
      console.log(response);
      //alert("File update successful!")
      if(response==null){
        alert("File update successful!");
      }
  })
  }

}

从'@angular/core'导入{Injectable}；
从'@angular/common/http'导入{HttpClient}；
从'@angular/common/http'导入{HttpHeaders}；
从'@angular/common/http/testing'导入{HttpClientTestingModule}；
从'@angular/compiler/src/util'导入{stringify}；
常量httpOptions={
标题：新的HttpHeaders({
“内容类型”：“应用程序/json”，
“授权”：“我的身份验证令牌”
})
};
出口类员工{
建造师(
公共empId:string，
公共名称：string，
公共名称：字符串，
公共工资：字符串，
) {}
}
导出类用户{
建造师(
公共id:String，
公共用户名：string，
公共密码：string，
) {}
}
出口类美国文件{
建造师(
公共文件名：string，
公共文件路径：字符串，
) {}
}
导出类SmsFiles{
建造师(
公共文件名：string，
公共文件路径：字符串，
) {}
}
导出类数据{
构造函数（公共flines:String）
{}
}
出口接口站{
id：编号；
userId:string；
正文：字符串；
标题：字符串；
}
@注射的({
providedIn:'根'
})
导出类HttpClientService{
构造函数（私有httpClient:httpClient）{}
getUsers（）
{console.log（“getUsers”）；
返回此.httpClient.get（'http://localhost:8080/findalluser');
}
getUssdFiles（）{
返回此.httpClient.get（'http://localhost:8080/findallussd');
}
getSmsFiles（）{
返回此.httpClient.get（'http://localhost:8080/findallsms');
}
getFileData（文件：字符串）{
//const str=JSON.stringify（this.httpClient.get（'http://localhost:8080/getfiledata/"文件",；
返回此.httpClient.get（'http://localhost:8080/getfiledata/"文件",；
}
postFileData（fileData:Object）{
控制台。日志（“！！！！！！！！！！！！！！！！！！！！！”）
console.log（文件数据）
返回此.httpClient.post（'http://localhost:8080/updatedfiledata，fileData）。订阅（响应=>{
控制台日志（响应）；
//警报（“文件更新成功！”）
如果（响应==null）{
警报（“文件更新成功！”）；
}
})
}
}

这是我在重新加载登录页面时在Devtools上的网络选项卡中看到的内容：

---

尝试在订阅代码本身中打印数据

this.httpClientService.getUsers().subscribe((response) =>{
        console.log("at subscribe");
        console.log(response);
        this.Users=response;
      }
);

---

由于订阅是一个

Async

过程，因此在该部分代码中打印

this.Users

将为您提供一个未定义的订阅

您应该看到

console.log（“at subscribe”）tho

放置
console.log（this.Users）

this.handleSuccessfulResponse(response);

对于未被调用的API，是否在“网络”选项卡中看到该调用？
尝试将用户声明为空数组，以开始，而不是未定义。假设您在DOM中使用*ngFor，并且无法迭代未定义

HTTP请求是异步的，因此它不一定在DOM呈现之前完成。若您将用户定义为一个空白数组，那个么它可以迭代这个数组，直到您的用户来自服务器

公共用户：数组=[]
尝试这样修改您的方法

getUsers(): Observable<User[]>
{ 
  console.log("at  getUsers");
  return this.httpClient.get<User[]>('http://localhost:8080/findalluser');
}

getUsers（）：可观察
{ 
console.log（“at getUsers”）；
返回此.httpClient.get（'http://localhost:8080/findalluser');
}
什么都没有。事件不打印“at subscribe”同样，我在HttpClientService上包含了一些用于单元测试的测试。测试通过，但此代码失败。但我从未改变过这段代码中的任何内容。这会影响到任何方面吗？我想httpClientService是空的，试着调试一下，看看我试着调试了。正在调用getUsers（）和subscribe，但流没有进入subscribe内部。可能我根本没有收到httpthis的响应。用户现在是[]（空），而不是“未定义”结果是解决方案。。
getUsers(): Observable<User[]>
{ 
  console.log("at  getUsers");
  return this.httpClient.get<User[]>('http://localhost:8080/findalluser');
}