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>

angular6实现对象转换数组对象的更多相关文章

简述JavaScript对象、数组对象与类数组对象
问题引出在上图给出的文档中,用JavaScript获取那个a标签,要用什么办法呢?相信第一反应一定是使用document.getElementsByTagName('a')[0]来获取.同样的,在使 ...
什么是“类数组对象”，在jquer中怎样将类数组对象转换为数组对象
类数组对象的定义: 所谓"类数组对象"就是一个常规的Object对象,如$("div")但它和数组对象非常相似:具备length属性, 并以0.1.2.3……等 ...
javascript中的字符串对象和数组对象
1.javascript的对象的概念在javascript中,除了null和undefined以处,其他的数据类型都被定义成了对象也可以用创建对象的方法定义变量,string,math,array ...
微信小程序 - 对象转换成对象数组
后端传过来的一个个对象 {1,2,3,4},{1,3,5,},{1,3,5} 我们应该转化为数组对象 [{},{},{},{}] ,最后通过wx:for遍历到页面示例图:
js中的函数，Date对象，Math对象和数组对象
函数就是完成某个功能的一组语句,js中的函数由关键字 function + 函数名 + 一组参数定义;函数在定义后可以被重复调用,通常将常用的功能写成一个函数,利用函数可以使代码的组织结构更多清晰. ...
学习笔记：javascript内置对象：数组对象
1.数组对象的创建 1.设置一个长度为0的数组 var myarr=new array(); 2.设置一个长度为n的数组 var myarr=new arr(n); 3.声明一个赋值的指定长度 ...
math对象与数组对象
1.math对象属性 //PI 圆周率方法 //random 随机数 var num= Math.random(); 生成0到1的随机数//round 四舍五入var num2 ...
js json对象和数组对象
动态添加json对象: var json = {}; json['a'] = 'a'; 动态添加数组对象: var arr = []; arr['a'] = 'a';
JS对象 Array 数组对象数组对象是一个对象的集合，里边的对象可以是不同类型的。数组的每一个成员对象都有一个“下标”，用来表示它在数组中的位置，是从零开始的
Array 数组对象数组对象是一个对象的集合,里边的对象可以是不同类型的.数组的每一个成员对象都有一个"下标",用来表示它在数组中的位置,是从零开始的数组定义的方法: 1. 定 ...

随机推荐

JS 删除数组中某个元素
//删除红色的元素 splice(下标,长度) var arr = ['a','b','c','d']; arr.splice(1,1); console.log(arr); //['a','c', ...
Python3的string库模板的应用
模板字符串模板将作为内置的拼接语法的替代用法.使用Template拼接时,要在名字前加前缀$来标识变量(例如,$var).或者,如果有必要区分变量和周围的文本,可以用大括号包围变量(例如,${var ...
Django基础-02
django的介绍: Django 中提供了开发网站经常用到的模块,常见的代码都为你写好了,通过减少重复的代码,Django 使你能够专注于 web 应用上有趣的关键性的东西.为了达到这个目标,Dj ...
C++对象模型复习
本文写于2017-02-24,从老账号迁移到本账号,原文地址:https://i.cnblogs.com/EditPosts.aspx?postid=6440685 一:对象模型 C++面向对象的实现 ...
EFCore Lazy Loading + Inheritance = 干净的数据表（二）【献给处女座的DB First程序猿】
前言本篇是上一篇EFCore Lazy Loading + Inheritance = 干净的数据表 (一) [献给处女座的DB First程序猿] 前菜的续篇.这一篇才是真的为处女座的DB Fi ...
yuv2mp4
>您使用什么类型的YUV像素格式?最常见的格式是YUV4:2:0平面8位(YUV420p).您可以键入ffmpeg -pix_fmts以获取所有可用格式的列表.>什么是帧率?在我的例子中, ...
redi应用-延时队列
有mq和Kafka,,一般用不上,,两个线程 ..基于Redis 的 list(列表),使用rpush/lpush操作入队列,使用lpop 和 rpop来出队列.
关于react的分页
基于antdesign分页:表格属性pagination <Table pagination={{ total: this.state.totalNum, showSizeChanger: tr ...
ORACLE视图简单创建和使用
1.创建 create view v (pdate,goodsId,productionId,qty)列名 as select p.pdate,p.goodsId,p.productionId,sum ...
Navicat连接Mysql报错：Client does not support authentication protocol requested by server；
Navicat连接Mysql报错:Client does not support authentication protocol requested by server: 刚安装Mysql,想用Nav ...

angular6实现对象转换数组对象

angular6实现对象转换数组对象的更多相关文章

随机推荐

热门专题