2013-07-19 62 views
0

我對emberjs相當陌生,並試圖利用didInsertElement事件時偶然發現了一個問題。emberjs didInsertElement not called

我已經創建了一個JSFiddle,您可以在其中看到句柄模板實際呈現,但didInsertelement事件在ApplicationView和HomeView中都未被調用。

的jsfiddle:​​

或者如果鏈路出現故障,我的代碼:

HTML:

<script type="text/x-handlebars" data-template-name="container"> 
    <!-- Imagine theme header content here --> 
    {{outlet "leftContent"}} 
    <!-- some more code here --> 
    {{outlet "pageContent"}} 
    <!-- and here --> 
    {{outlet "rightContent"}} 
    <!-- and a footer here --> 
</script> 

<script type="text/x-handlebars" data-template-name="leftSidebar"> 
    <p>A left sidebar</p> 
</script> 
<script type="text/x-handlebars" data-template-name="rightSidebar"> 
    <p>A right sidebar</p> 
</script> 

<script type="text/x-handlebars" data-template-name="homepageContent"> 
    <p>This is the {{pageTitle}}!</p> 
</script> 

的Javascript:

Ember.LOG_BINDINGS = false; 

MyApp = Ember.Application.create(); 
MyApp.Router.map(function() { 
    //Home Page 
    this.route("home", { path: "/" }); 
}); 

//======================= 
//= ROUTES   = 
//======================= 
MyApp.ApplicationRoute = Ember.Route.extend({ 
    renderTemplate: function() { 
     this.render("container"); 

     this.render('leftSidebar', { outlet: 'leftContent', into: 'container' }); 
     this.render("rightSidebar", { outlet: 'rightContent', into: 'container' }); 
    } 
}); 

MyApp.HomeRoute = Ember.Route.extend({ 
    setupController: function(controller) { 
     controller.set('pageTitle', "homepage"); 
    }, 

    renderTemplate: function() { 
     this.render('homepageContent', { outlet: 'pageContent', into: 'container' }); 
    } 
}); 

//======================= 
//= CONTROLLERS  = 
//======================= 
MyApp.ApplicationController = Ember.Controller.extend(); 
MyApp.HomeController = Ember.Controller.extend(); 

//======================= 
//= VIEWS    = 
//======================= 
MyApp.ApplicationView = Ember.View.extend({ 
    didInsertElement: function(event) { 
     console.debug("Applicationview didInsertElement() called"); 
    } 
}); 

MyApp.HomeView = Ember.View.extend({ 
    didInsertElement: function(event) { 
     console.debug("Homeview didInsertElement() called"); 
    } 
}); 

我在做什麼錯?

回答

4

applicationRoute中,您覆蓋了renderTemplate。結果ApplicationView永遠不會呈現。您不需要容器模板。您的根模板應該是application

此外,主頁的Ember.View和模板不匹配。您命名模板homepageContent和視圖App.HomeView。 Ember.js根據您的要求呈現homepageContent,但未找到App.HomepageContentView。從未使用過App.HomeView

我做你的提琴更正:http://jsfiddle.net/QZZFY/5/

+0

感謝您的明確的解釋! – xorinzor