2014-01-23 4 views
1

각 체크 박스가 표시되면 체크 된 모든 값을 가져올 수 있습니다.각 시계에서 체크 박스 그룹 값을 얻습니다.

이 값을 각각의 그룹에 넣고 싶습니다. 선택한 값을 얻기 위해 각 $ 시계를 사용하여

메신저 : 여기

내 예상 결과입니다.

$scope.$watch('filters|filter:{selected:true}', function (nv, ov, scope) { 
    $scope.filter_selected = []; 

angular.forEach(nv, function (value) { 
    angular.forEach(value.options, function (v, k) { 
     if (v.selected == true) { 
      this.push(v.name); 
     } 
    }, $scope.filter_selected); 
}); 
}, true); 

here is the full code in fiddle

업데이트 :이 코드 내 예상 결과를 얻을 관리

:

$scope.$watch('filters|filter:{selected:true}', function (nv, ov, scope) { 
    $scope.filter_selected = {pattern: [], colour: []}; 
    angular.forEach(nv, function (value) { 
    if (value.name == 'pattern') { 
     angular.forEach(value.options, function (v, k) { 
      console.log(this); 
      if (v.selected == true) { 

       this.push(v.name); 
      } 
     }, $scope.filter_selected.pattern); 
    } 

    if (value.name == 'colour') { 
     angular.forEach(value.options, function (v, k) { 
      //console.log(this); 
      if (v.selected == true) { 

       this.push(v.name); 
      } 
     }, $scope.filter_selected.colour); 
    }    
}); 

updated fiddle

을 이제 어떻게 내 검사 부분을 동적으로 만들 수 있습니다 더 많은 그룹이 있다면?

+0

문제에 대해 자세히 설명 할 수는 없지만 이해하기가 어렵습니다. 아마도 바이올린을 사용하여 문제에 도달하는 단계를 설명하십시오. –

+0

안녕 MWay, 나는 나의 최신 코드로 문제를 업데이트했다. – od3n

답변

1

위의 내용을 간소화하여 원하는 결과를 얻을 수 있도록 코드를 업데이트했습니다. 나는 정말로 당신이 시계가 필요하다고 생각하지 않는다. (당신의 업데이트 요구 사항이 더 복잡하지 않다면), 그러나 당신은 이것을 결코 덜 만들 수 없어야한다.

app.controller('FilterCtrl', function ($scope, $http) { 

    $scope.filters = [ 
     { name: 'pattern', placeholder: 'pattern', 
      options: [ 
       { name: 'Plain', selected: false },  
       { name: 'Self Design', selected: false },  
       { name: 'Check', selected: false },  
       { name: 'Stripe', selected: false },  
       { name: 'Print', selected: false } 
      ]}, 
     { name: 'colour', placeholder: 'colour', 
      options: [ 
       { name: 'White', selected: false }, 
       { name: 'Blue', selected: false }, 
       { name: 'Grey', selected: false } 
      ]} 
    ]; 

    $scope.updateOutput = function() {   
     $scope.filter_selected = {}; 
     angular.forEach($scope.filters, function(f) { 
      $scope.filter_selected[f.name] = []; 
      angular.forEach(f.options, function(o){ 
       if(o.selected){ 
        $scope.filter_selected[f.name].push(o.name); 
       } 
      }); 
     }); 
    } 
}); 

그냥주의, 뷰도 컨트롤러에 맞게 변경 될 필요가 있다고 다음과 같이

http://jsfiddle.net/j35zt/

컨트롤러 코드는 간단했다. 기본적으로 ng-change이 유일한 업데이트 원인입니다.

관련 문제