搜索条件构建angularJS的使用

controller.js代码:

app.controller("searchController",function($scope,searchService){
	 
	$scope.searchMap={'keywords':'','category':'','brand':'','spec':{}};
	 
	//搜索
	$scope.search=function(){
	
		searchService.search($scope.searchMap).success(function(response){
			$scope.resultMap=response;
			 
		});
	}
	
	
	//添加搜索项,改变searchMap的值
	$scope.addSearchItem=function(key,value){
		//如果用户点击的是分类和品牌
		if(key=='category'||key=='brand'){
			$scope.searchMap[key]=value;
		}else{ //点击的是规格
			
			$scope.searchMap.spec[key]=value;

		}
		
	}
	
	//删除搜索条件
	$scope.removeSearchItem=function(key){
		//如果用户点击的是分类和品牌
		if(key=='category'||key=='brand'){
			$scope.searchMap[key]="";
		}else{ //点击的是规格
			
		delete	$scope.searchMap.spec[key];

		}
		
	}
	
	
	 
	
});

前台页面代码:

<!--list-content-->
	<div class="main">
		<div class="py-container">
			<!--bread-->
			<div class="bread">
				<ul class="fl sui-breadcrumb">
					<li>
						<a href="#">搜索条件</a>
					</li>							
				</ul>
				<ul class="tags-choose">
					<li class="tag" ng-if="searchMap.category!=''"  			 ng-click="removeSearchItem('category')">商品分类:{{searchMap.category}}<i class="sui-icon icon-tb-close"></i></li>
					<li class="tag" ng-if="searchMap.brand!=''"     			 ng-click="removeSearchItem('brand')">品牌:{{searchMap.brand}}<i class="sui-icon icon-tb-close"></i></li>
					<li class="tag" ng-repeat="(key,value) in searchMap.spec" 	 ng-click="removeSearchItem(key)"> {{key}}:{{value}}<i class="sui-icon icon-tb-close"></i></li>
				</ul>
				 
				<div class="clearfix"></div>
			</div>
			
			<!--selector-->
			<div class="clearfix selector">
			
				<div class="type-wrap" ng-if="resultMap.categoryList!=null&&searchMap.category==''">
					<div class="fl key">商品分类</div>
					<div class="fl value">
						<span ng-repeat="category in resultMap.categoryList">
						<a href="#" ng-click="addSearchItem('category',category)" >{{category}}</a>   
						</span>
					</div>
					<div class="fl ext"></div>
				</div>

				<div class="type-wrap logo" ng-if="resultMap.brandList!=null&&searchMap.brand==''">
					<div class="fl key brand">品牌</div>
					<div class="value logos">
						<ul class="logo-list">
							<li ng-repeat="brand in resultMap.brandList">
							<a href="#" ng-click="addSearchItem('brand',brand.text)" >{{brand.text}}</a>
							</li>
						</ul>
					</div>
					
					<div class="ext">
						<a href="javascript:void(0);" class="sui-btn">多选</a>
						<a href="javascript:void(0);">更多</a>
					</div>
					
				</div>
				<div class="type-wrap" ng-repeat="spec in resultMap.specList" ng-if="searchMap.spec[spec.text]==null">
					<div class="fl key">{{spec.text}}</div>
					<div class="fl value">
						<ul class="type-list">
							<li ng-repeat="option in spec.options">
								<a href="#" ng-click="addSearchItem(spec.text,option.optionName)">{{option.optionName}}</a> 
							</li>
						</ul>
					</div>
					<div class="fl ext"></div>
				</div>