두 개의 드롭 다운 필터. 첫 번째는 두 번째 정보를 결정합니다.

Question

몇 시간 동안 노력했지만이 방법을 잘 모릅니다. 내 코드는 다소 가깝게 보이지만 HTML에서 컨트롤러로 내 선택을 전달할 수는 없습니다.

내 각도 코드 :

var Categories = Parse.Object.extend("bizCategories"); 

     $scope.categories = [ 
      {category: "Food and Drink"}, 
      {category: "Healthcare"}, 
      {category: "Recreation"}, 
      {category: "Service"}, 
      {category: "Shops"}, 
      {category: "Travel"} 
     ] 

     $scope.setPrimary = function (category) { 
      $scope.offer.primary = category; 
      $scope.secondaryCategories(category); 
     }; 

     $scope.secondaryCategories = function(category){ 
      var Secondary = new Parse.Query(Categories); 
      Secondary.limit(1000); 
      Secondary.find({ 
       success:function(list){ 
        $scope.SecondaryCategories = _.uniq(_.filter(_.map(list, function(item){ 
         return{primary: item.get('secondary') 
         }} 
        )),'primary',true) 
        console.log($scope.SecondaryCategories); 
       }, 
       error: function(error){alert("A mistake was made."); 
       } 
      }) 
     } 

내 HTML :

<select id= 'primary' ng-model="offer.primary" ng-options="XXX.category for XXX in categories" 
       ng-click= setPrimary(category)> 
      <option value="">Primary Business Category</option> 
     </select> 

     <select id= 'secondary' ng-model="offer.secondary" ng-disabled="!offer.primary" 
       ng-options="XXX.category for XXX in SecondaryCategories" ng-click="setSecondary('XXX.category')"> 
      <option value="">Secondary Business Category</option> 
     </select> 

당신은 내가 NG-옵션에 대한 내 HTML에서 XXX를 집어 것을 볼 수 있습니다. 내가 튜토리얼에서 말할 수있는 것부터 특히 무엇이라도 부를 수있는 목적이 임의적이기 때문에 이것을 골랐다. 나는이 XXX을 그 문제가 아닌 것으로 만들었다. 또한, 첫 번째 드롭 다운에서 정보를 두 번째 드롭 다운 (범주)에 대한 기능을 수행해야하지만 그것은 정의되지 않은 것으로 나타납니다.

데이터 소스 : 당신은 당신은 ng-change 대신 ng-click 사용해야합니다 (1)의 선택에 다른 드롭 다운을 설정하려고처럼

Answer 1

보인다.

시도 : - 이후

<select id= 'primary' ng-model="offer.primary" ng-options="XXX.category for XXX in categories" 
      ng-change= setPrimary(category)> 
     <option value="">Primary Business Category</option> 
    </select> 

    <select id= 'secondary' ng-model="offer.secondary" ng-disabled="!offer.primary" 
      ng-options="XXX.category for XXX in SecondaryCategories" ng-change="setSecondary('XXX.category')"> 
     <option value="">Secondary Business Category</option> 
    </select> 

당신의 ng-model가 이미 offer.primary에 바인딩, 이미 설정되었을 NG 모델부터 $scope.offer.primary = category; 일을 피할 수 있습니다.