Checkbox过滤器在Angular JS中不起作用?

时间:2017-02-04 09:15:02

标签: angularjs

我已经应用了复选框过滤器,使用了过滤功能数据,但加载后整个页面数组内容没有显示,如果用户勾选复选框,数据只显示检查1条件,如何解决?



/**
  - @Copyright Notice:
  - @(#)
  - @Type: Controller
  - @For: seller_dashboard_controller.js used for  seller_dashboard.jsp page
  - @Description: 
 */

bobApp.controller("buyerDashboardProfileController", ['$scope', 'BuyerDashboardService', function($scope, BuyerDashboardService) {
	
	/**
	 * @Summary:getIntermediaryOnBuyerDashboard, to get the connected intermediary List.
	 * @param:   callback
	 * @return:  callback(response) .
	 * @Description: 
	 */
	$scope.connetedIntermediary = [];
	
	//Defining function for $scope.getConnectedIntermediary in service 
	$scope.getConnectedIntermediary = function() {
		//used for get connected intermediary
		var data = {
				buyerUserTypeKeyId  : Number(AUTH.userTypeKeyId),
				userTypeRel         : "buyer",
				reqFromUserType     : "buyer",
				reqToUserType       : "intermediary"
		};
		BuyerDashboardService.getBuyerDashboard(function(response) {
			if(response != null) {
				if(response.data.isSuccess) {
					$scope.connetedIntermediary = response.data.userRelationDto;
				}
			}
		},data)
	};
	$scope.getConnectedIntermediary();
	

	/**
	 * @Summary:connectedSeller, to get the connected connected SellerList.
	 * @param:   callback
	 * @return:  callback(response) .
	 * @Description: 
	 */
	$scope.connectedSeller = [];
	//Defining function for $scope connetedSeller in service 
	$scope.getConnectedSeller = function() {
		//used for get connected seller
		var data = {
				buyerUserTypeKeyId  : Number(AUTH.userTypeKeyId),
				userTypeRel         : "buyer",
				reqFromUserType     : "buyer",
				reqToUserType       : "seller"
		};
		BuyerDashboardService.getBuyerDashboard(function(response) {
			if(response != null) {
				if(response.data.isSuccess) {
					$scope.connectedSeller = response.data.userRelationDto;
				}
			}
		},data)
	};
	$scope.getConnectedSeller(); 
	
	/**
	 * @Summary:filterCityList, to get the filtered cityList.
	 * @param:   callback
	 * @return:  callback(response) .
	 * @Description: 
	 */
	
	  $scope.filterCityList = [];
	//Defining function for includeCity for received the city after click on the checkbox 
	 $scope.includeCity = function(city) {
		var i = $.inArray(city, $scope.filterCityList);
				if (i > -1) {
					$scope.filterCityList.splice(i, 1);
				} else {
					$scope.filterCityList.push(city);
			}
		}
		
	//Defining  cityFilter function for filter the city for the connectedSeller
	$scope.cityFilter = function(connectedSeller) {
		if ($scope.includeCity.length > 0) {
			if ($.inArray(connectedSeller.city, $scope.filterCityList) < 0)
				return;
			}
		return connectedSeller;
	}
	}
]);
&#13;
<div id="seller" class="userTab" style="display:none">
			<div class="w3-col m7 l9">
				<div class="w3-container w3-card-2 w3-white w3-hover-light-grey" 
					ng-repeat="seller in connectedSeller.sellerDtos | filter:cityFilter" 
					style="margin:0 0px 0px 0px; padding:0px;">
					<img src="{{seller.userTypeDto.imageURL !=null ? seller.userTypeDto.imageURL : '/static/assets/img/image_placeholder.jpg'}}" 
						class="w3-border w3-padding w3-margin-right pull-left userImg">
					<div class="">
						<h5 class="w3-opacity w3-padding-top">
							<b>{{seller.firmName}}</b>
						</h5>
						<h6 class="w3-text-teal">
							<i class="fa fa-user fa-fw"></i>
							{{seller.personName}}
							<span class="w3-tag w3-teal w3-round w3-small">
								{{seller.userTypeDto.userType}}
							</span>
						</h6>
						<p>
							<span ng-if="seller.userTypeDto.email">
								Email - {{seller.userTypeDto.email}} |
							</span>
							<span ng-if="seller.userTypeDto.phoneNumber"> 
								Contact Number - {{seller.userTypeDto.phoneNumber}} |
							</span>
							<span ng-if="seller.city"> 
								City - {{seller.city}} |
							</span>
							<span ng-if="seller.state"> 
								State- {{seller.state}} 
							</span>
						</p>
					</div>
				</div>
			</div>
		</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:-1)

/**
  - @Copyright Notice:
  - @(#)
  - @Type: Controller
  - @For: seller_dashboard_controller.js used for  seller_dashboard.jsp page
  - @Description: 
 */

bobApp.controller("buyerDashboardProfileController", ['$scope', 'BuyerDashboardService', function($scope, BuyerDashboardService) {
	
	/**
	 * @Summary:getIntermediaryOnBuyerDashboard, to get the connected intermediary List.
	 * @param:   callback
	 * @return:  callback(response) .
	 * @Description: 
	 */
	$scope.connetedIntermediary = [];
	
	//Defining function for $scope.getConnectedIntermediary in service 
	$scope.getConnectedIntermediary = function() {
		//used for get connected intermediary
		var data = {
				buyerUserTypeKeyId  : Number(AUTH.userTypeKeyId),
				userTypeRel         : "buyer",
				reqFromUserType     : "buyer",
				reqToUserType       : "intermediary"
		};
		BuyerDashboardService.getBuyerDashboard(function(response) {
			if(response != null) {
				if(response.data.isSuccess) {
					$scope.connetedIntermediary = response.data.userRelationDto;
				}
			}
		},data)
	};
	$scope.getConnectedIntermediary();
	

	/**
	 * @Summary:connectedSeller, to get the connected connected SellerList.
	 * @param:   callback
	 * @return:  callback(response) .
	 * @Description: 
	 */
	$scope.connectedSeller = [];
	//Defining function for $scope connetedSeller in service 
	$scope.getConnectedSeller = function() {
		//used for get connected seller
		var data = {
				buyerUserTypeKeyId  : Number(AUTH.userTypeKeyId),
				userTypeRel         : "buyer",
				reqFromUserType     : "buyer",
				reqToUserType       : "seller"
		};
		BuyerDashboardService.getBuyerDashboard(function(response) {
			if(response != null) {
				if(response.data.isSuccess) {
					$scope.connectedSeller = response.data.userRelationDto;
				}
			}
		},data)
	};
	$scope.getConnectedSeller(); 
	
	/**
	 * @Summary:filterCityList, to get the filtered cityList.
	 * @param:   callback
	 * @return:  callback(response) .
	 * @Description: 
	 */
	
	  $scope.filterCityList = [];
	//Defining function for includeCity for received the city after click on the checkbox 
	 $scope.includeCity = function(city) {
		var i = $.inArray(city, $scope.filterCityList);
				if (i > -1) {
					$scope.filterCityList.splice(i, 1);
				} else {
					$scope.filterCityList.push(city);
			}
		}
		
	//Defining  cityFilter function for filter the city for the connectedSeller
	$scope.cityFilter = function(connectedSeller) {
		if ($scope.includeCity.length > 0) {
			if ($.inArray(connectedSeller.city, $scope.filterCityList) < 0)
				return;
			}
		return connectedSeller;
	}
	}
]);
<div id="seller" class="userTab" style="display:none">
			<div class="w3-col m7 l9">
				<div class="w3-container w3-card-2 w3-white w3-hover-light-grey" 
					ng-repeat="seller in connectedSeller.sellerDtos | filter:cityFilter" 
					style="margin:0 0px 0px 0px; padding:0px;">
					<img src="{{seller.userTypeDto.imageURL !=null ? seller.userTypeDto.imageURL : '/static/assets/img/image_placeholder.jpg'}}" 
						class="w3-border w3-padding w3-margin-right pull-left userImg">
					<div class="">
						<h5 class="w3-opacity w3-padding-top">
							<b>{{seller.firmName}}</b>
						</h5>
						<h6 class="w3-text-teal">
							<i class="fa fa-user fa-fw"></i>
							{{seller.personName}}
							<span class="w3-tag w3-teal w3-round w3-small">
								{{seller.userTypeDto.userType}}
							</span>
						</h6>
						<p>
							<span ng-if="seller.userTypeDto.email">
								Email - {{seller.userTypeDto.email}} |
							</span>
							<span ng-if="seller.userTypeDto.phoneNumber"> 
								Contact Number - {{seller.userTypeDto.phoneNumber}} |
							</span>
							<span ng-if="seller.city"> 
								City - {{seller.city}} |
							</span>
							<span ng-if="seller.state"> 
								State- {{seller.state}} 
							</span>
						</p>
					</div>
				</div>
			</div>
		</div>