A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

本帖最后由 谷粒姐姐 于 2018-8-23 16:20 编辑

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

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

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

生成的顺序如下图:
5.1 前端代码
5.1.1 生成 SKU列表(深克隆)
(1)在 goodsController.js 实现创建 sku 列表的方法
[AppleScript] 纯文本查看 复制代码
//创建 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  =
[AppleScript] 纯文本查看 复制代码
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)在页面上添加表达式,进行测试
[AppleScript] 纯文本查看 复制代码
{{entity.itemList}}
显示效果如下:

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马