javascript - How can I wrap jQuery Justified Gallery in an Ember Component? -


i'm trying wrap plugin justified gallery in ember component. main problem i'm facing list of photos in gallery come api, they're part of model. have far:

app.justifiedgallerycomponent = ember.component.extend({     _init: function() {         this.$().justifiedgallery({             rowheight: 150,             fixedheight: false,             margins: 7         });     }.on('didinsertelement') }); 

template

{{#each photo in items}}   <div>     <img src={{photo.thumburl}} />   </div> {{/each}} 

but can't work, because list of photo inside each loop, , when plugin applied photos still not in dom? approach problem?

thanks!

edit:

taking reference component masonry i've got sorted, first time navigate url nothing shows, if go second route (inside ember app) , go gallery displays fine , justified. component now:

import ember 'ember';  var getoptions = function (keys) {   var properties = this.getproperties(keys);    object.keys(properties).foreach(function (key) {     if (properties[key] === "null") {       properties[key] = null;     }      if (properties[key] === undefined) {       delete properties[key];     }   });    return properties; };  export default ember.component.extend({   classnames: ['justified-grid'],    options: null,   items: null,    setup: ember.on('didinsertelement', function() {     this.set('options', getoptions.call(this, [       'rowheight',       'fixedheight',       'margins'     ]));      this.justifygrid();   }),     justifygrid: ember.observer('items.@each', function() {     var _this = this;      imagesloaded(this.$(), function() {         _this.$().justifiedgallery(_this.get('options'));         _this.set('gridinitialized', true);     });   }) }); 

the problem wasn't in component. model loading photos using async (ember data). reason, in router, after setting model, had force ember data load photos:

aftermodel: function(model) {     return em.rsvp.all([model.get('photos')]); } 

Comments

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

java - How to filter a backspace keyboard input -

java - Show Soft Keyboard when EditText Appears -