2014-02-14 62 views
3

我目前正在忙於學習ember.js,我想知道如何最好地使用與燼磚砌體。我找不到任何好的howtos。任何人都有一些提示?如何將jquery-masonry與ember.js集成?

+0

在模板我答道幫助你指出正確的方向? – bejonbee

+0

非常感謝。我現在取得了一些進展。 – jonas

回答

2

我對原型進行了非常粗糙的整合。下面的代碼是一個很好的起點,但需要更多的工作,這取決於用戶如何與內容交互。

這裏假設你已經有了一個可用於渲染的ArrayController的工作內容頁面。

這裏是利用磚石查看:

App.HomeView = Ember.View.extend({ 

    onDidInsertElement: function() { 
    this.reMason(); 
    }.on('didInsertElement'), 

    onWillDestroy: function() { 
    this.$('.masonry').masonry('destroy'); 
    }.on('willDestroy'), 

    reMason: function() { 
    this.$('.masonry').masonry({ 
     // masonry init options here 
    }); 
    this.$('.masonry').imagesLoaded(function() { 
     this.$('.masonry').masonry(); 
    }.bind(this)); 
    } 

}); 

這裏我們渲染HTML砌築

<script type="text/x-handlebars" data-template-name="homeView"> 
    ... 
    <div class="masonry"> 
     {{#each}} 
     // render each masonry item here. 
     {{/each}} 
    </div> 
    ... 
</script>