商品录入【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. Python_字符串的映射与可变字符串的应用

    ''' maketrans().translate() maketrans()方法用来生成字符映射表,而translate()方法则按映射表中定义的对应关系转换并替换其中的字符,使用这两个方法的组合可 ...

  2. Junit-4.1.2 @Test 使用

    学习使用Junit-4.1.2 @Test来做单元测试 1.下载jar包 下载junit-4.12.jar 下载hamcrest-core-1.3.jar 2.在External Libraries中 ...

  3. Linux时间子系统之二:Alarm Timer

    一.前言 严格来讲Alarm Timer也算POSIX Timer一部分,包含两种类型CLOCK_REALTIME_ALARM和CLOCK_BOOTTIME_ALARM.分别是在CLOCK_REALT ...

  4. (一)linux定时任务的设置 crontab 基础实践

    为当前用户创建cron服务 1.  键入 crontab  -e 编辑crontab服务文件 例如 文件内容如下: */2 * * * * /bin/sh /home/admin/jiaoben/bu ...

  5. mysqldump详解

    Ⅰ.mysqldump的简单使用与注意点 1.1 基本参数 只备份innodb,用不了几个参数,记住下面几个即可,其他的没什么卵用 -A 备份所有的database -B 备份哪几个数据库 -R 备份 ...

  6. LoadRunner Mysql性能优化

    原文:https://blog.csdn.net/u011910905/article/details/49863787 一.查询与索引优化分析 1.show命令: show engines; 显示存 ...

  7. tkinter中表格的建立(十三)

    表格的建立 import tkinter from tkinter import ttk wuya = tkinter.Tk() wuya.title("wuya") wuya.g ...

  8. 你不知道的JavaScript--Item7 函数和(命名)函数表达式

    1.函数声明与函数表达式 在ECMAScript中,创建函数的最常用的两个方法是函数表达式和函数声明,两者期间的区别是有点晕,因为ECMA规范只明确了一点:函数声明必须带有标示符(Identifier ...

  9. Postman用法简介

    转自:http://blog.csdn.net/flowerspring/article/details/52774399 Postman用法简介 转载 2016年10月10日 09:04:10 10 ...

  10. OpenCV-Python学习01

    import tensorflow as tf 1 # -*- coding: utf-8 -*- 2 """ 3 Created on Tue Dec 31 19:16 ...