2015-01-15 5 views
2

나는 다소 각도에 익숙하지 않고 현재 학교 프로젝트를 통해이 아름다운 프레임 워크를 배우고 있습니다. 하지만 지금은 해결할 수없는 문제가 발생했습니다. 나는 인터넷에서 많이 검색했지만 나에게 도움이되는 것을 발견하지 못했습니다.Ng 반복 각도 "2 레이어"JSON 문제

이는 JSON 내 컨트롤러에 포함되어 그

(function() { 
     app.controller('imageController', function(){ 

     this.imageList = imageJson; 
     }); 

     var imageJson = [{ 
      "traveling": [{ 
       "name": "Kenneth Appiah", 
       "label": "pisa", 
       "src": "public/media/images/noun/traveling/pisa.svg" 
      }, 
      { 
       "name": "Oliver TubeGeometry", 
       "label": "eiffel tower", 
       "src": "public/media/images/noun/traveling/eiffel.svg" 
      }, 
      { 
       "name": "Adriano Gazzellini", 
       "label": "colosseum", 
       "src": "public/media/images/noun/traveling/colisseum.svg" 
     }] 
    }]; 

})(); 

내가, 내가 부르는, 두 층 JSON (당신은 내가 :-) 여기에 무엇을 의미하는지 이해 희망) 사용하고 있습니다. 그러나 어떤 이유로 인해 HTML에서 내 데이터 태그에있는 이러한 데이터에 연결할 수 없습니다. 나는 어떤 각도 기본적인 튜토리얼을했고, 그 방법과 같이 시작하지 않는 JSON이 작업을 수행하는 저를 배운 :

"traveling": [{ 
      "name": "Kenneth Appiah", 
      "label": "pisa", 
      "src": "public/media/images/noun/traveling/pisa.svg" 
     }] 

그러나이 같은 :

{ 
       "name": "Kenneth Appiah", 
       "label": "pisa", 
       "src": "public/media/images/noun/traveling/pisa.svg" 
      } 

그래서 내 가정이 있다는 것 내 데이터 바인딩은 {{image.traveling.src}}와 유사합니다. 이미지는 내가 ng-repeat라고 불렀다. 그러나 이것은 효과가 없어서 혼란 스럽습니다.

이 내 HTML하다 (NG-응용 프로그램도 포함하지만, 자사의 differend 파일에)

<section class="words"> 
    <div class="colored-sidebar"></div> 
    <!-- content --> 
    <div class="previous-button"></div> 
    <div class="word-container" ng-controller="imageController as imageCtrl"> 
     <h1><span>noun</span>words</h1> 
     <div class="category-body"> 
     <p><span>noun</span>traveling</p><hr> 
     <div class="category-image" ng-repeat="image in imageList.traveling"> 
      <img src="{{image.src}}" /> 
     </div> 
    </div> 
    </section><!-- 
--></div> 

인해 내 시행 착오에 나는 터널 비전에 현재입니다. 어쩌면 제가 감독하는 것일 수도 있지만 제 문제에 대해 긍정적 인 피드백과 비평을하고 싶습니다. 필요한 코드를 놓친 경우 다른 사람이 나를 더 잘 도와 줄 수 있도록 게시 해 드리겠습니다. JSON으로 아직 많이 작동하지 않았습니다. 멍청한 놈 문제 일 경우 미안합니다.

감사합니다. 관련!

답변

0

json 개체에 문제가 있습니다. 아래와 같이 json을 포맷하면 정상적으로 동작합니다.

var imageJson = { 
      "traveling": [{ 
       "name": "Kenneth Appiah", 
       "label": "pisa", 
       "src": "public/media/images/noun/traveling/pisa.svg" 
      }, 
      { 
       "name": "Oliver TubeGeometry", 
       "label": "eiffel tower", 
       "src": "public/media/images/noun/traveling/eiffel.svg" 
      }, 
      { 
       "name": "Adriano Gazzellini", 
       "label": "colosseum", 
       "src": "public/media/images/noun/traveling/colisseum.svg" 
      }] 
     }; 
+0

감사를 작동합니다 .... ng-repeat="image in imageList"

var imageJson=[{ "name": "Kenneth Appiah", "label": "pisa", "src": "public/media/images/noun/traveling/pisa.svg" }, { "name": "Oliver TubeGeometry", "label": "eiffel tower", "src": "public/media/images/noun/traveling/eiffel.svg" }, { "name": "Adriano Gazzellini", "label": "colosseum", "src": "public/media/images/noun/traveling/colisseum.svg" }]; 

사용하여 작동합니다! 나는 내 코드 안에 json을 암시했다. 그것은 오류가 발생하지 않기 때문에 괜찮다고 생각합니다. 심지어 내가 콘솔을 볼 때도 그럴 수 있습니다. 로그 : http://imgur.com/oqAtbCJ 아무 것도 반복하지 않습니다. 내가 놓친 게 있니? –

+0

이미지가 표시되지 않는다는 것을 의미합니까? –

+0

또한 컨트롤러에 범위를 삽입하십시오. app.controller ('imageController', function ($ scope) { $ scope.imageList = imageJson; }); –

0

시도해보십시오. 나는 그것은 확실히