2014-10-25 3 views
0

나는 tr을 다른 td구성 요소 안에 넣고 있습니다.각도 : 반복 내부 메모리 전환 문제

많은 td구성 요소가 있으며을 사용할 수 있으며 일부만 렌더링됩니다.

<tr ng-repeat='row in rowlist'> 
    <td ng-repeat='columnType in columnsThatShouldBeDisplayed' ng-switch='columnType'> 
    <colA ng-switch-when='typeA'></colA> 
    <colB ng-switch-when='typeB'></colB> 
    <colC ng-switch-when='typeC'></colC> 
    // and so on.. 
    <td> 
</tr> 

이것은 많은 메모리를 필요로합니다. 모든 구성 요소가 구성되는 것처럼 보이지만 각 반복마다 하나만 표시됩니다.

올바른 방법은 무엇입니까? 문제를 해결하고 다른 방식으로 수행하는 방법에 대한 도움말?

+0

의 속성과 NG-스위치를 포함해야? 구축하려는 간단한 테이블 구조를 제공 할 수 있습니까? 이미지, HTML, 모든 것이 잘 될 것입니다. – Linial

+2

ng-switch-when은 DOM에서 비교할 수없는 스위치 내용을 제거하므로 최종 DOM은 최소한으로 만 사용해야합니다. 그래서 그것은 많은 기억을 가져 가지 않습니다. – harishr

답변

0

당신은 반복 요소 나는 간단한 일을 요청할 수 있습니다

<div ng-controller="formPersonalInfoController"> 
    <form role="form"> 
     <div ng-repeat="Country in Countries" class="animate-switch-container" ng-switch on="Country.name"> 
      <div> 
       <div class="animate-switch" ng-switch-when="Andorra"> 
        <div class="form-group"> 
         <div class="col-md-6"> 
          <label class="text-info">{{ Country.name }} :</label> 
         </div> 
         <div class="col-md-6"> 
          <textarea id="{{Country.Id}}" class="form-control" placeholder="{{ Country.name }}"></textarea> 
         </div> 
        </div> 
       </div> 
       <div class="animate-switch" ng-switch-default> 
        <div class="form-group"> 
         <div class="col-md-6"> 
          <label class="text-info">{{ Country.name | uppercase }} :</label> 
         </div> 
         <div class="col-md-6"> 
          <input id="{{Country.Id}}" class="form-control" type="text" placeholder="{{ Country.name }}" /> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
</form> 
</div>