商品录入【SKU 商品信息】
5.1 需求分析

基于上一步我们完成的规格选择,根据选择的规格录入商品的 SKU 信息,当用户选择相应的规格,下面的 SKU 列表就会自动生成,如下图:

实现思路:实现思路:

(1)我们先定义一个初始的不带规格名称的集合,只有一条记录。
(2)循环用户选择的规格,根据规格名称和已选择的规格选项对原集合进行扩充,添加规格名称和值,新增的记录数与选择的规格选项个数相同

生成的顺序如下图:

5.1 前端代码
5.1.1 生成 SKU列表(深克隆)
(1)在 goodsController.js 实现创建 sku 列表的方法

//创建 SKU 列表

$scope.createItemList=function(){

$scope.entity.itemList=[{spec:{},price:0,num:99999,status:'0',isDefault:'0'  }  ]
;//初始 var items= $scope.entity.goodsDesc.specificationItems; for(var i=0;i< items.length;i++){ $scope.entity.itemList = addColumn( $scope.entity.itemList,items[i].attributeName,items[i].attributeValue ); } } //添加列值addColumn=function(list,columnName,conlumnValues){
var newList=[];//新的集合 for(var i=0;i<list.length;i++){ var oldRow= list[i]; for(var j=0;j<conlumnValues.length;j++){ var newRow= JSON.parse( JSON.stringify( oldRow ) );//深克隆 newRow.spec[columnName]=conlumnValues[j]; newList.push(newRow);
} } return newList; }

(2)在更新规格属性后调用生成 SKU 列表的方法

(3)在页面上添加表达式,进行测试

{{entity.itemList}}
显示效果如下:

Java之品优购课程讲义_day06(7)的更多相关文章

  1. 品优购(IDEA版)-第一天

    # 品优购(IDEA版)-第一天 品优购IDEA版应该是2019年的新项目.目前只有视频.资料其他都还是旧的. ## 1.学习目标 1:了解电商行业特点以及理解电商的模式 2:了解整体品优购的架构特点 ...

  2. 项目二:品优购 第二天 AngularJS使用 brand商品页面的增删改查

    品优购电商系统开发 第2章 品牌管理 传智播客.黑马程序员 1.前端框架AngularJS入门 1.1 AngularJS简介 AngularJS  诞生于2009年,由Misko Hevery 等人 ...

  3. 品优购(IDEA版)-第二天

    品优购-第2天 学习目标 目标1:运用AngularJS前端框架的常用指令 目标2:完成品牌管理的列表功能 目标3:完成品牌管理的分页列表功能 目标4:完成品牌管理的增加功能 目标5:完成品牌管理的修 ...

  4. 品优购商城项目(六)CAS客户端与SpringSecurity集成

    cas单点登录旨在解决传统登录模式session在分布式项目中共享登录信息的问题. 本文cas服务器使用 4.0版本,仅供学习参考.把 cas.war 直接部署在tomcat即可,这里有个固定的用户名 ...

  5. 品优购商城项目(二)mybatis分页插件

    品优购商城项目第二天,使用mybatis分页插件实现分页.主要实现的是 SSM整合mybatis分页. 一.引用mybatis分页插件 SqlMapConfig.xml <?xml versio ...

  6. 品优购商城项目(二)AngularJS、自动代码生成器、select2下拉多选框

    品优购商城想项目第二阶段 AngularJS.自动代码生成器.select2下拉多选框 完成了课程第三天.第四天的的任务. 1.学习了AngularJs前端的mvc分层思想,js部分分成control ...

  7. 品优购商城项目(三)安全框架SpringSecurity

    品优购商城项目第三阶段 1.springSecurity的基本用法与shiro类似. 2.BCrypt加密算法比MD5更加智能和安全,能自动加盐再加密,生成的密码是60位比md5的32位更占空间(可以 ...

  8. 使用IDEA实现品优购项目搭建

    转发自 https://www.jianshu.com/p/4710a87b65fa 使用idea实现品优购项目搭建 1.使用idea实现品优购项目搭建 本篇文章只针对品优购第一天使用 IDEA 搭建 ...

  9. 品优购商城项目(一)mybatis逆向工程

    第一阶段 dubboX和mybatis逆向工程 用了四天时间才完成品优购项目前两天的任务. 1.其中主要遇到的坑就是zookeeper服务消费者无法调用的问题.造成这个问题的主要原因就是忽略了dubb ...

随机推荐

  1. va_start,va_arg,va_end的使用

    一.在C中,当我们无法列出传递函数的所有实参的类型和数目时,可以用省略号指定参数表. void fun(...); void fun(parm_list,...); #include <stdi ...

  2. 洛谷 P2491 解题报告

    P2491 消防 题目描述 某个国家有n个城市,这n个城市中任意两个都连通且有唯一一条路径,每条连通两个城市的道路的长度为zi(zi<=1000). 这个国家的人对火焰有超越宇宙的热情,所以这个 ...

  3. 微信对账单处理-PHP

    最近要做支付对账,即检查第三方支付与数据库中账单是否一一对应,涉及到微信对账单的处理,成功时,微信账单接口返回数据以文本表格的方式返回,第一行为表头,后面各行为对应的字段内容,字段内容跟查询订单或退款 ...

  4. 开机出现 grub rescue> 终端模式修复方法

    1.  先使用ls命令,找到Ubuntu的安装在哪个分区:     grub rescue>ls     会罗列所有的磁盘分区信息,比方说:     (hd0),(hd0,msdos3),(hd ...

  5. Java开源生鲜电商平台-订单抽成模块的设计与架构(源码可下载)

    Java开源生鲜电商平台-订单抽成模块的设计与架构(源码可下载) 说明:订单抽成指的是向卖家收取相应的信息服务费.(目前市场上有两种抽成方式,一种是按照总额的抽成比率,另外一种是按照订单明细的抽成比率 ...

  6. 这样入门asp.net core 之 静态文件

    本文章主要说明asp.net core中静态资源处理方案: 一.静态文件服务 首先明确contentRoot和webroot这两个概念 contentRoot:web的项目文件夹,其中包含webroo ...

  7. border-radius 圆角

    border-radius:3px;  参数的单位可以使绝对的像素px,也可以用相对单位%; 参数顺序是左上角,右上角,右下角,左下角. 圆角: div{width: 100px;height: 10 ...

  8. python 3.6 lxml标准库lxml的安装及etree的使用注意

    据我所知,python 3.5之后的lxml模块里面不再包含etree,那么要怎么解决这个问题呢? lxml模块下的etree函数的使用问题,部分lxml模块不再支持etree方法,因此只能想办法下载 ...

  9. [爬虫]Scrapy 错误ordinal not in range(128)

    报错了: UnicodeDecodeError: 'ascii' codec can't decode byte 0xb0 in position 1: ordinal not in range(12 ...

  10. java分割字符串用法

    转自 http://www.cnblogs.com/dawnLynn/p/5477263.html 1."."和"|"都是转义字符,必须得加"\\&q ...