하위 뷰의 이미지가 emberjs에로드되었음을 알리는 방법

Question

하위 뷰 중 하나의 이미지가 완전히로드되어 dom에 표시되면 부모 뷰에 어떻게 통보합니까? 모든 이미지가로드 된 후 모든 어린이의 전체 높이를 측정해야합니다. . didInsertElement으로 측정하면 잘못된 높이가되므로 이미지 높이가없는 높이가 반환됩니다.

그래서 이것은 내보기 구조와 같은 모습입니다 :

styledmediaitem가 서버에 올바른 경로와 함께 <img src=""/>를 출력하는 핸들 도우미가

{{#view App.ArtistBoxesView}} 
    {{#each artist in controller}} 
    {{#view App.ArtistBoxView}} 
     <div class="artist"> 
     <div class="thumb">{{styledmediaitem artist.thumb style="thumb"}}</div> 
     </div> 
    {{/view}} 
    {{/each}} 
{{/view}} 

.

ArtistBoxView의 이미지 (또는 모든 이미지가 더 좋을 때)가 완전히 사전로드 될 때 ArtistBoxesView에 알림을 보내고 싶습니다.

Answer 1

보기의 didInsertElement fx에서 jQuery ImagesLoaded plugin을 사용해보십시오. 이 같은 일이 트릭을해야합니다 :

App.ArtistBoxView = Ember.View.extend({ 
    didInsertElement: function() { 
    this.$().imagesLoaded(function($images, $proper, $broken) { 
     console.log($images.length + ' images total have been loaded'); 
     console.log($proper.length + ' properly loaded images'); 
     console.log($broken.length + ' broken images'); 
    }); 
    } 
});