2017-04-12 1 views
0

을 반복하는 방법 : -나는 세 가지 체크 박스를 얼마나 확인란 개체

<label>Type:</label> 
<label>one</label> 
    <input type="checkbox" name="type" ng-model="a.Type[0]"/> 

    <label>two</label> 
    <input type="checkbox" name="type" ng-model="a.Type[1]"/> 

    <label>three</label> 
    <input type="checkbox" name="type" ng-model="a.Type[2]"/> 

이 체크 박스는 문자열의 배열로 백엔드에 저장됩니다.

내 값에 표시됩니다 : -

<li class="list-group-item"><strong>Type</strong>: <span ng-repeat="values in myArray">{{values}}</span></li> 

내 지시어 코드는 다음과 같습니다 - 여기에 내가 '형'체크 박스를 반복 할 IS-하는 것을 시도하고있는 무슨

(function() { 
    'use strict'; 
    angular.module('myApp.components') 
     .directive('abc', abc); 

    abc.$inject = ['$http', '$timeout', 'ApiServices']; 

    function abc($http, $timeout, ApiServices) { 
     return { 
      restrict: 'EA', 
      scope: { 

      }, 

      link: function (scope, el, attrs) { 
       scope.a = {}; 

       $('#abc').on('hide.bs.modal', function() { 
        scope.active = false; 
       }); 
       $('#abc').on('shown.bs.modal', function() { 
        scope.active = true; 

        scope.myArray = []; 

        scope.iterate = function() { 
        for (var key in scope.a.Type) { 
         if (scope.a.Type.hasOwnProperty(key)) { 
         scope.myArray.push(scope.a.Type[key]); 
         } 
        } 
        }; 

        scope.iterate(); 
      }, 
      templateUrl: '' 
     }; 
    } 

})(); 

'myArray'에 값을 푸시 한 다음 값만 표시합니다.

+0

여기서 무엇을하려고하는지 명확하게 알 수는 없습니다. 당신은 알려지지 않은 지시자에 대해'link' 함수를 보여 주며, 링크 함수는 빈 객체를 통해 * 즉시 반복하려고 시도합니다. 어쨌든 배열을 반복하려고하는 이유는 무엇입니까? '$ scope.a.Type'은 이미 당신이 찾고있는 배열이 아니겠습니까? 예 : $ scope.a.Type "'에서 ng-repeat ="값을 사용할 수 있습니까? – Claies

+0

scope.a.Type은 백엔드의 문자열 배열에 있지만 값을 저장할 때 키가 인덱스 번호이고 값이 이름 인 객체로 저장됩니다 - 하나, 둘, 셋. 그래서, 내가하고있는 일은 그 객체를 통해 반복하고 값을 얻은 다음 'myArray'로 밀어 넣은 다음 배열의 값을 표시하는 것입니다. –

+0

하지만 (적어도이 코드에는 포함되어 있지 않습니다.) 지시어가 무엇을하고 있는지 알지 못하지만이 링크 함수는'scope.a = {}; '를 설정하고 즉시 그것을 반복하려고 시도합니다. – Claies

답변

0

아마, 아래에있는 내 예제는 다소 유사하다 당신을 위해 무엇을 찾고 :

HTML :

<span>Select Type:</span> 
    <div ng-repeat="type in myArray"> 
    <input type="checkbox" ng-model="type.value" /> {{type.type}} 
    </div> 

    <span>Selected Types:</span> 
    <div ng-repeat="type in myArray"> 
    <span ng-show="type.value"> {{type.type}}</span> 
    </div> 

JS :

내가 생각
$scope.a = {}; 
    $scope.a.Type = ["One","Two","Three"]; // your string array 

    $scope.myArray = []; 
    $scope.a.Type.forEach(function(item){ 
    $scope.myArray.push({type: item, value: false }); // create new array to make it selectable via checkbox 
    }); 

, 당신은 더 이상 당신의 지시가 필요합니다 지금. 반복 및 필터링은 HTML 자체에서 수행됩니다.

이 정보가 도움이되기를 바랍니다.