angular6实现对象转换数组对象

1 使用表单获取到数据以后,是对象类型的数据如下图

  

而后台需要返回的数据是这种key:value的形式传入

2   废话不多说直接上代码(代码只截取部分,仅供参考跑不起来,最后又一个小demo可以运行)

 public discountArr = []; // 折扣数组容器
  public discountContent = { 'name': '', 'value': '' }; // 折扣转换对象容器
  public setDiscount = {}; // 折扣返回数据
 
 ngOnInit() {
    // 页面初始化发送请求获取数据折后
    this.service.getProductDiscount(this.userId).subscribe(data => {
      if (data.code !== 0) {
        // TODO 错误处理
        console.log(data.message);
      } else {
       返回成功后把获取到的数据赋值给页面的数据
        console.log(data, '折扣');
        this._discount.EIP = data.result.EIP;
        this._discount.EBS = data.result.EBS;
        this._discount.ECS = data.result.ECS;
        this._discount.SLB = data.result.SLB;
        this._discount.OSS = data.result.OSS;
        this._discount.CPS = data.result.CPS;
        this._discount.CAAS = data.result.CAAS;
        this._discount.VPC = data.result.VPC;
        this._discount.SBW = data.result.SBW;
        this._discount.RDSMysql = data.result.RDSMysql;
        this._discount.CDN = data.result.CDN;
      }
    });
  // 表单获取到的数据 
    this.discount = this.fb.group({
      EIP: [10, [Validators.required]],
      EBS: [9, [Validators.required]],
      ECS: [null, [Validators.required]],
      SLB: [null, [Validators.required]],
      OSS: [null, [Validators.required]],
      CPS: [null, [Validators.required]],
      CAAS: [null, [Validators.required]],
      VPC: [null, [Validators.required]],
      SBW: [null, [Validators.required]],
      RDSMysql: [null, [Validators.required]],
      CDN: [null, [Validators.required]],
    });
    console.log(this.discount.value);
  }
  //  表单提交执行函数
  onSubmit() {
    // tslint:disable-next-line:forin
   //  循环表单获取的数据
    for (const key in this.discount.value) {
     // 每次执行行前让新对象为空
      this.discountContent = { 'name': '', 'value': '' };
      //  如果为空的话
      if (!this.discountContent[key]) {
       // 把拆分开的数据分别放入key value
        this.discountContent.name = key;
        this.discountContent.value = this.discount.value[key];
      }
      //  每次拆分成功插入数组
      this.discountArr.push(this.discountContent);
    }
    // 转换成后台需要的数据格式
    this.setDiscount = {
      operatorId: this.marketId,
      discount: this.discountArr,
    };
     console.log(this.setDiscount);
    // 发送修改记录
    this.service.changeProductDiscount(this.userId, this.setDiscount).subscribe(data => {
      if (data.code != 0) {
        // TODO 错误处理
        this.notification.create(`error`, '失败',
          data.message);
      } else {
        this.notification.create(`success`, '成功',
          '折扣已修改成功');
      }
    });
  }

3  数据转换 demo 示例 (这个可以跑)

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>

</body>
<script type="text/javascript">
    var json = {
        "CAAS":10,
        "CDN": 10,
        "CPS": 10,
        "EBS": 10,
        "ECS": 10,
        "EIP": 10,
        "OSS": 10,
        "RDSMysql": 10,
        "SBW": 10,
        "SLB": 10,
        "VPC": 10
    };
    var arr = [];
    var json1= {};
    for(let key in json){
        
        json1 = {};
        if(!json1[key]){
            json1.name = key;
            json1.value = json[key];
        }
        arr.push(json1);
    }
    console.log(arr);
</script>
</html>
原文地址:https://www.cnblogs.com/zxbky/p/10036841.html