콘텐츠의 동적 변경이 더 나은 방법입니다. AngularJS 1.6

Question

배너에 대한 정보를 제공하는 REST 서비스가 있습니다. 메인 페이지에서 슬라이더의 동적 변경에이 정보를 사용하고 싶습니다.

그래서 $ http.get을 사용하여 데이터를 얻은 다음 보간을하고 몇 가지 추가 ng-if를 사용하여 특정 데이터가 있는지 확인하고 일부 요소를 표시할지 여부를 확인합니다.

<div class="main-block" ng-if="locale==='ru'"> 
      <div ng-repeat="slider in restData.result" ng-class="{'active':$first}" class="slide {{ slider.location }}" ng-style="{'background-image':'url({{ slider.url.url }})'}"> 

       <div class="content-block"> 

        <div class="container"> 
         <div class="right-block"> 
          <h2>{{ slider.text1 }}</h2> 
         </div> 
         <div class="clearfix"></div> 
         <div ng-if="slider.text2 || slider.text3 || slider.text4 || slider.text5" class="offer-block" ng-style="{'background':'rgba({{ slider.color }},0.6)'}"> 
          <div class="offer-block__country">{{ slider.text2 }}</div> 
          <div class="offer-block__name"> 
           {{ slider.text3 }} 
          </div> 
          <div class="offer-block__days"> 
           {{ slider.text4 }} 
          </div> 
          <div class="offer-block__date"> 
           {{ slider.text5 }} 
          </div> 
         </div> 
         <div class="clearfix"></div> 
         <a ng-if="slider.link" ui-sref="shell.tourShow({url:'{{ slider.link }}'})" class="orange-btn"> 
          Подробнее 
         </a> 
        </div> 
       </div> 
      </div> 
     </div> 

그러나 나는 이러한 유형의 데이터 조작으로 더 잘 읽고 이해할 수있는 방법이 있어야한다고 생각합니다. 좀 더 나은 방법을 찾거나 도와 줄 수 있습니까?

Answer 1

는 내가 변화 할 유일한 것은 바로 ng-repeat="slider in restData.result"

에 매핑 아니라

$scope.sliders = {}; 

// in rest request update the local variable with most recent data 
// and then use ng-repeat="slider in sliders"