Question

最初它工作正常。当我选择国家时它会过滤状态，但问题是当我选择＆＃34; - 选择国家 - ＆＃34;它从列表中显示整个状态。谢谢你的到来。

 <form class="form-horizontal" ng-controller="dropdownCtrl">
 <label for="country" class="col-sm-2 control-label">Country </label>
  <div class="col-sm-7">             
    <select ng-model="customer.Country"                
            ng-options="obj.country as obj.country for obj in countries"
            ng-change="getCountryStates()"
            class="form-control" 
            ng-required="true"
            id="country">
      <option value="">-- Choose Country --</option>
    </select>      
  </div>
<div class="col-sm-7">             
      <div ng-repeat="item in list">
    <input type="checkbox"  ng-model="item.selected" value="{{item.value}}"/>
    <label>{{item.value}}</label>
  </div>

这是我的Controller.js

 var myApp = angular.module('myApp',[]);

myApp.controller('dropdownCtrl', ['$scope','CustomerService',       function($scope, CustomerService) {

  $scope.customer ={
     Country:'', 
     state: '' 
  };

  $scope.countries = CustomerService.getCountry();

  $scope.getCountryStates = function(){
     $scope.list = CustomerService.getCountryState($scope.customer.Country);

  }}]);

这是我的Service.js

myApp.factory("CustomerService", ['$filter', function($filter){
var service = {};
   var countrylist =
   [
         { "id": 1, "country": "USA" },
         { "id": 2, "country": "AUS" },
         { "id": 3, "country": "India" },
  ];


var list = [
        { "id": 1, "value": "New York", "countryId":'USA'},
        { "id": 2, "value": "LA","countryId":'USA' },

        { "id": 4, "value": "Sydny","countryId":'AUS' },
        { "id": 5, "value": "Victoria","countryId":'AUS' },

        { "id": 7, "value": "Delhi","countryId":'India' },
        { "id": 8, "value": "Mumbai","countryId":'India' },

 ];
     service.getCountry = function(){    
         return countrylist;
    };

    service.getCountryState = function(countryId){
    var states = ($filter('filter')(list, {countryId: countryId}));
    return states;
    };


  return service;


}]);

Answer 1

     $scope.getCountryStates = function(){
         $scope.list = CustomerService.getCountryState($scope.customer.Country);
}
 //above function can be changed to
$scope.getCountryStates = function(){
     if($scope.customer.Country)
       $scope.list = CustomerService.getCountryState($scope.customer.Country);
     else $scope.list = []
};

从下拉列表中选择默认值时隐藏复选框。[Angular js]

1 个答案: