品优购电商系统开发第 10 章五

最新推荐文章于 2021-05-10 16:07:20 发布

我是楠楠

最新推荐文章于 2021-05-10 16:07:20 发布

阅读量264

点赞数

分类专栏：技术文章

本文链接：https://blog.csdn.net/qq_40208605/article/details/106681616

版权

本文详细介绍了品优购电商系统中搜索条件的构建过程，包括需求分析、搜索项添加、显示面包屑、撤销搜索项和隐藏查询面板的各个步骤。用户可以通过点击分类、品牌和规格来构建查询条件，条件以面包屑形式展示，点击面包屑上的 X 可撤销条件，同时恢复搜索面板的显示。整个功能涉及对 searchController.js 和 search.html 的修改。

摘要由CSDN通过智能技术生成

6.过滤条件构建
6.1 需求分析
点击搜索面板上的分类、品牌和规格，实现查询条件的构建。查询条件以面包屑的形式显示。
当面包屑显示分类、品牌和规格时，要同时隐藏搜索面板对应的区域。
用户可以点击面包屑上的 X 撤销查询条件。撤销后显示搜索面包相应的区域。
6.2 添加搜索项
6.2.1 添加搜索项方法
修改 pinyougou-search-web 的 searchController.js

$scope.searchMap={'keywords':'','category':'','brand':'','spec':{}};//搜索对象
//添加搜索项
$scope.addSearchItem=function(key,value){
if(key=='category' || key=='brand'){//如果点击的是分类或者是品牌
$scope.searchMap[key]=value;
}else{
$scope.searchMap.spec[key]=value;
}
}

6.2.2 点击搜索项