We've got an Ember app and need to do some library initialization when rendering some templates.
-
Google+, Facebook and Twitter APIs for widgets. We do the initialization inside the
applicationroute, as well as inside each template that contains those specific widgets, for the use case when the user lands on that page directly. The problem is that Facebook and Twitter do not initialize at all when coming from another route. Google+, however, does. Also, if we refresh the page on which all 3 widgets reside, they all render correctly. The example below is a route calledblogwhich also returns a model from the server API.renderTemplate: function () { this._super(); // initialize side nav drawer Ember.$(document).ready(function () { Ember.$('.button-collapse').sideNav(); Ember.$('select').material_select(); }); // load Google+ SDK Ember.$.getScript("http://ift.tt/1xN9CxI"); // initialize Facebook SDK var facebook_id = this.facebook_app_id; window.fbAsyncInit = function () { FB.init({ appId: facebook_id, xfbml: true, version: 'v2.1' }); }; (function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) { return; } js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/sdk.js"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); // load Twitter API window.twttr = (function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], t = window.twttr || {}; if (d.getElementById(id)) { return t; } js = d.createElement(s); js.id = id; js.src = "https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs); t._e = []; t.ready = function (f) { t._e.push(f); }; return t; }(document, "script", "twitter-wjs")); } -
Materialize side drawer (http://ift.tt/1ASonEP). We need to initialize this globally, as it will be used when the user access the website from a smartphone or tablet. The problem here is that on routes which return models from our server API, the side drawer doesn't work, even though we do the initialization inside the
applicationroute, after the template is rendered. Why isn't it working on routes with models?renderTemplate: function () { this._super(); Ember.$(document).ready(function () { Ember.$('.button-collapse').sideNav(); Ember.$('select').material_select(); });}
Aucun commentaire:
Enregistrer un commentaire