Angular 5中如何向函数传递接口返回的账号密码数组

嘿，作为Angular新手不用纠结，其实实现思路和你熟悉的PHP非常相似，只是语法上要贴合TypeScript/JavaScript的习惯～

首先得明确：你PHP里写的关联数组$credentials = ['username'=> $response.user.username, 'password'=> $response.user.password];，在JS/TS里对应的是对象（而不是数组，除非你的login函数明确要求参数是数组包裹的结构）。

基础实现方式 #

假设你已经从接口获取到了包含用户信息的response对象，直接创建凭证对象然后传入函数即可：

// 从接口拿到response数据后
const credentials = {
  username: response.user.username,
  password: response.user.password
};

// 调用登录函数
this.login(credentials);

如果login函数需要数组格式的参数 #

要是你的login方法必须接收一个数组（比如和你PHP代码里写的array(['username'=>...])结构完全一致），那只需要把凭证对象放进数组里：

const credentials = [{
  username: response.user.username,
  password: response.user.password
}];

this.login(credentials);

进阶：给响应数据定义类型（更规范的写法） #

作为Angular项目，推荐用TypeScript的接口来约束响应数据的结构，这样代码更易维护，也能避免拼写错误：

// 先定义响应数据的接口
interface UserLoginResponse {
  user: {
    username: string;
    password: string;
  };
}

// 假设你用HttpClient请求接口（Angular推荐的HTTP请求方式）
this.http.get<UserLoginResponse>('你的接口URL').subscribe(response => {
  const credentials = {
    username: response.user.username,
    password: response.user.password
  };
  this.login(credentials);
});

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