2017-03-19 1 views
1

다른 이미지 배열에서 ng 반복을 사용하려고합니다. 문제는 이러한 이미지가 인라인이어야하고 전환이 필요하다는 것입니다. 여기에 내가 NG 반복 사용하기로 결정하기 전에 한 내용은 다음과 같습니다이미지 배열을 Ng 반복합니다.

`<div class="row"> 
     <div class="col-md-3"> 
      <div class="flip-container" ontouchstart="this.classList.toggle('hover');"> 
       <div> 
        <div class="front"> 
         <img id="firstTrophy" class="trophy locked" src="/img/trophy.png" /> 
        </div> 
        <div class="back box"> 
         <p class="text"> 
        You're a champion!!!! 
         </p> 
        </div> 
       </div> 
      </div> 
     </div>` 

을 그리고 여기 내가 지금 가지고있는 NG-반복이다 :

(in view.html) 
`<div ng-repeat="trophy in trophies track by $index"> 
          <img src="{{ trophy }}" />` 

var trophies = [ 
"img/trophy.png", 
"img/trophy.png", 
"img/trophy.png", 
"img/trophy.png", 
"img/trophy.png"]; 

감사에 대한 (컨트롤러) 모두가 제공 할 수있는 모든 도움!

+0

와 SRC를 교체합니다. [ngSrc] (https://docs.angularjs.org/api/ng/directive/ngSrc)를 방문하십시오. –

답변

3

당신은`NG-SRC = "{{트로피}}"`대신`src`를 사용해야합니다 ng-src

<div ng-repeat="trophy in trophies track by $index"> 
          <img ng-src="{{ trophy }}" />` 

DEMO