Java之品优购课程讲义_day06(7)
商品录入【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)的更多相关文章
- 品优购(IDEA版)-第一天
# 品优购(IDEA版)-第一天 品优购IDEA版应该是2019年的新项目.目前只有视频.资料其他都还是旧的. ## 1.学习目标 1:了解电商行业特点以及理解电商的模式 2:了解整体品优购的架构特点 ...
- 项目二:品优购 第二天 AngularJS使用 brand商品页面的增删改查
品优购电商系统开发 第2章 品牌管理 传智播客.黑马程序员 1.前端框架AngularJS入门 1.1 AngularJS简介 AngularJS 诞生于2009年,由Misko Hevery 等人 ...
- 品优购(IDEA版)-第二天
品优购-第2天 学习目标 目标1:运用AngularJS前端框架的常用指令 目标2:完成品牌管理的列表功能 目标3:完成品牌管理的分页列表功能 目标4:完成品牌管理的增加功能 目标5:完成品牌管理的修 ...
- 品优购商城项目(六)CAS客户端与SpringSecurity集成
cas单点登录旨在解决传统登录模式session在分布式项目中共享登录信息的问题. 本文cas服务器使用 4.0版本,仅供学习参考.把 cas.war 直接部署在tomcat即可,这里有个固定的用户名 ...
- 品优购商城项目(二)mybatis分页插件
品优购商城项目第二天,使用mybatis分页插件实现分页.主要实现的是 SSM整合mybatis分页. 一.引用mybatis分页插件 SqlMapConfig.xml <?xml versio ...
- 品优购商城项目(二)AngularJS、自动代码生成器、select2下拉多选框
品优购商城想项目第二阶段 AngularJS.自动代码生成器.select2下拉多选框 完成了课程第三天.第四天的的任务. 1.学习了AngularJs前端的mvc分层思想,js部分分成control ...
- 品优购商城项目(三)安全框架SpringSecurity
品优购商城项目第三阶段 1.springSecurity的基本用法与shiro类似. 2.BCrypt加密算法比MD5更加智能和安全,能自动加盐再加密,生成的密码是60位比md5的32位更占空间(可以 ...
- 使用IDEA实现品优购项目搭建
转发自 https://www.jianshu.com/p/4710a87b65fa 使用idea实现品优购项目搭建 1.使用idea实现品优购项目搭建 本篇文章只针对品优购第一天使用 IDEA 搭建 ...
- 品优购商城项目(一)mybatis逆向工程
第一阶段 dubboX和mybatis逆向工程 用了四天时间才完成品优购项目前两天的任务. 1.其中主要遇到的坑就是zookeeper服务消费者无法调用的问题.造成这个问题的主要原因就是忽略了dubb ...
随机推荐
- Centos制作本地yum源
本地YUM源制作 1. YUM相关概念 1.1. 什么是YUM YUM(全称为 Yellow dog Updater, Modified)是一个在Fedora和RedHat以及CentOS中的Shel ...
- ubuntu 命令整合1
一.linux命令基本格式 命令名[选项] [参数] 注意: 命令名区分字母大小写 命令名必须有 选项.参数可以没有,选项一般使用减号开头二.具体Linux命令 1.who 显示登录系统中的用户的信息 ...
- Servlet知识点总结
一, ServletAPI中有4个Java包: 1.javax.servlet:其中包含定义Servlet和Servlet容器之间契约的类和接口 2.javax.servlet.http:其中包含定义 ...
- Maven项目打包为jar的几种方式
这里收集整理下以往打包MAVEN项目为JAR包的各种方式 直接打包,不打包依赖包 直接打包,不打包依赖包,仅打包出项目中的代码到JAR包中.在POM中添加如下plugin即可,随后执行maven in ...
- java导入excel时处理日期格式(已验证ok)
在Excel中的日期格式,比如2009-12-24将其转化为数字格式时变成了40171,在用java处理的时候,读取的也将是40171.如果使用POI处理Excel中的日期类型的单元格时,如果仅仅是判 ...
- Socket 聊天工具
package cn.davy.mychat; import org.eclipse.swt.widgets.Display; import org.eclipse.swt.widgets.FontD ...
- swoft 源码解读【转】
官网: https://www.swoft.org/ 源码解读: http://naotu.baidu.com/file/814e81c9781b733e04218ac7a0494e2a?toke ...
- C3垂直居中均分
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Python实现猜数字游戏1.0版
本文由荒原之梦原创,原文链接:http://zhaokaifeng.com/?p=702 """ 功能: 随机生成一个数字,最多有3次猜测机会,如果第一次没有猜对,则从第 ...
- Ubuntu 16.04下安装64位谷歌Chrome浏览器
1.进入 Ubuntu 16.04 桌面,按下 Ctrl + Alt + t 键盘组合键,启动终端. 也可以按下 Win 键(或叫 Super 键),在 Dash 的搜索框中输入 terminal 或 ...