AngularJS와가 - - 체크 박스 선택에/숨기기 테이블 열을 표시하는 방법 중첩 된 NG-반복

Question

내 코드 문제 here을 보여주는으로 Plunker을 만든

에서 생성을 : 당신은 예를 들어, 클릭하면

당신이 볼 수 있듯이 'de'체크 박스는 테이블 제목의 표시/숨기기를 토글합니다. 그러나 로캘 (여기서는 'de')에 해당하는 열 표제 아래의 <textarea> 값은 표시하지 않습니다. 이는 현재 작동하려고합니다.

locale.Selected 체크 박스 값에 따라 <textarea>을 연결하는 방법을 생각할 수 없습니다. 그래서 locale.Locale == res.LocaleIDlocale.Selected 값에 따라 표시/숨기기를 원할 때.

<table class="table"> 
    <tr> 
     <th>Resource Id</th> 
     <th ng-repeat="locale in view.resourceGridResources.Locales" ng-show="locale.Selected"> 
      {{locale.Locale ? locale.Locale : "invariant" }} 
     </th> 
    </tr> 
    <tr ng-repeat="resource in view.resourceGridResources.Resources"> 
     <td>{{resource.ResourceId}}</td> 
     <td ng-repeat="res in resource.Resources"> 
      <textarea ng-model="res.Value" 
         ng-blur="view.saveGridResource(res)" 
         style="min-width: 300px" 
         //trying to get to locale.Selected here - how get index 'x'? 
         ng-show="view.resourceGridResources.Locales[x].Selected"> 
         </textarea> 
     </td> 

    </tr> 
</table> 

here 같은 것을 implment 시도 - 사용자가 체크 상자를 클릭하고 숨기기/표시 테이블 열을 전환됩니다있다.

참고 :

vm.check = function(res) { 
    return vm.resourceGridResources.Locales.find(function(loc) { 
    return loc.Locale === res.LocaleId && loc.Selected; 
    }); 
}; 

: 나는

Answer 1

JS에 함수를 쓸 필요는 없습니다. resource.Resources의 항목 수는 view.resourceGridResources.Locales의 항목 수와 동일합니다.

HTML

<td ng-repeat="res in resource.Resources" ng-show="vm.resourceGridResources.Locales[$index].Selected">   
     <textarea ng-model="res.Value" 
        style="min-width: 300px"></textarea> 
    </td> 

작업 Plunker : http://plnkr.co/edit/Al4KdHlCV2uo9HQ2qNt7?p=preview

Answer 2

가 컨트롤러에이 방법을 추가 등 JSON 형식을 변경 여부를 제어 할 수 없습니다, 그래서 내 데모 plunker 내 더 큰 프로젝트에서 문제의 단지 예입니다 보기에 조건 추가 :

<td ng-repeat="res in resource.Resources" ng-show="vm.check(res)"> 

실무 데모 : http://plnkr.co/edit/neQtu8qxQQVP2kDIY5ru?p=preview.