Angular 6 和 PHP：即使使用附加到 httpParams，HttpClient 也不会将数组发送到服务器

Question

我需要使用Angular 6 的HttpClient 将一组数据发送到PHP 服务器。

我有一些下拉列表，我从中选择并推入一个数组：

arrayOfLegalProtection=[];
addSit(){
    let l_id = '';
    let p_id = '';
    let s_id = '';
    let add_date = '';
    l_id = this.formGroup.controls['l_id'].value;

    p_id = this.formGroup.controls['p_id'].value;
    s_id = this.formGroup.controls['s_id'].value;
    add_date = this.formGroup.controls['add_date'].value;
    this.showSubHeader++;
    this.arrayOfLegalProtection.push({lId: l_id, 
      pId: p_id,
      sId: s_id, 
      addDate: add_date})
    console.log(this.arrayOfLegalProtection);
}

控制台结果显示正确的推送值：

[{"lId":"1","prId":"1","sId":"2","addDate":"2018-09-14"},

{"lId":"","pId":"1","sId":"5","addDate":"2018-09-14"},

{"lId":"","pId":"2","sId":"","addDate":"2018-09-20"}]

现在，我需要将此数组添加到 httpclient post 方法并将其发送到服务器，但正如讨论中所说的 of this post，数组无法通过 angular 的 HttpClient 库发送。

我们需要使用append，或者JSON.stringify()或者.append()。

我posted a question 使用JSON.stringify() 的方法后，你可以看到有错误。即使多维数组包含 0 或 N 行数据，即使 echo count($array) 始终是 1。

所以我换了另一种方法，使用.append()：

saveUnitData(unit_type, 
    location_type_id, user_id, number_of_hh, unit_status, add_date, arrayOfActualities)
  { 
    console.log(user_id);
    let httpParam = new HttpParams().set('unit_type', unit_type)
                                      .set('location_type_id', location_type_id)
                                      .set('user_id', user_id)
                                      .set('number_of_hh', number_of_hh)
                                      .set('unit_status',unit_status)
                                      .set('add_date', add_date);
    Object.keys(arrayOfActualities).forEach(key=>{
      httpParam = httpParam.append('arrayOfActualities', arrayOfActualities);
    })
                                      //.set('arrayOfActualities', arrayOfActualities);
    let headerOptions = new HttpHeaders();
    headerOptions.append('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
    console.log('h'+arrayOfActualities);
    return this.http.post(this.globalVar.UnitSavedataUrl, httpParam, {headers: headerOptions});
  }

使用此代码：

Object.keys(arrayOfActualities).forEach(key=>{
          httpParam = httpParam.append('arrayOfActualities', arrayOfActualities);

我尝试使用 append 将对象转换为数组，以便可以通过 httpClient 服务发送。

在请求的头部，我们可以看到发送的普通数据，但是数组却被重复了上百次。

服务器的响应总是：

C:\wamp64\www\dev\UnitSaveData.php:23:string '[{"legalId":"","protectionId":"","situationId":"","addDate":"2018-09-14"},{"legalId":"","protectionId":" ","situationId":"","addDate":"2018-09-14"}]' (长度=147)

但没有向数据库中添加任何内容。

请注意PHP脚本与previous unanswered post相同

Answer 1

我找到了解决办法。

是的，HttpClient() 接受一个数组作为HttpParams()。

对于 Angular 脚本，我正在执行以下操作：

let httpParam = new HttpParams().set('unit_type', unit_type)
   .set('location_type_id', location_type_id)
   .set('user_id', user_id)
   .set('number_of_hh', number_of_hh)
   .set('unit_status',unit_status)
   .set('add_date', add_date)
   .set('arrayOfActualities', arrayOfActualities); 

正如HttpParams() 文档所述，.set() 将值作为字符串，即使使用json_encode() 也会混淆服务器端脚本。

所以解决方案是将数组附加到arrayOfActualities：

let httpParam = new HttpParams().set('unit_type', unit_type)
    .set('location_type_id', location_type_id)
    .set('user_id', user_id)
    .set('number_of_hh', number_of_hh)
    .set('unit_status',unit_status)
    .set('add_date', add_date)
    .set('arrayOfActualities', arrayOfActualities);

httpParam.append('arrayOfActualities', JSON.stringify(arrayOfActualities));

在 PHP 端，我需要使用 json_decode($arr, true)，以便让服务器脚本遍历数组，因为遍历 json 数组对我来说是个问题，因为它无法读取字段标题因为双引号：

$arr = json_decode($arrayOfActualities, true);
if(count($arr)>0)
  {
     foreach($arr as $array)
     {

     }
  }

...

正如@B.Fleming 所说：

您的 PHP 脚本正在调用 json_encode()，它会生成 JSON 细绳。如果您的意图是将 JSON 转换为数组，请执行 json_decode()。不过，在任何事情之前，请确保无论您是什么 传入 json_decode() 还不是一个数组。