emjer.js視圖不能閱讀上下文

Question

我有以下js，基於emberjs.com路由教程。 var'wontAppear'將不會映射到相應的視圖中。

Quiz = Em.Application.create({ 
ApplicationView: Ember.View.extend({ 
    templateName: 'App' 
}), 
IntroSettings : Ember.Object.extend(), 
ApplicationController: Ember.Controller.extend({ 
    titlebar: 'My New App', 
}), 

IntroView: Ember.View.extend({ 
    templateName: 'Intro' 
}), 
IntroController: Em.ObjectController.extend({ house: "2" }), 

CountDownView: Ember.View.extend({ 
    templateName: 'CountDown', 
    didInsertElement: function() { 
     this.$().hide().show('drop', { direction: "right" }, 200); 
    }, 
}), 
CountDownController: Em.ObjectController.extend({ 

}), 

Router: Em.Router.extend({ 
    enableLogging: true, 
    root: Ember.Route.extend({ 
     index: Ember.Route.extend({ 
      route: '/', 
      connectOutlets: function (router, context) { 
       router.get('applicationController').connectOutlet('body','Intro'); 
      }, 
      countDown: Ember.Route.transitionTo('countDown') 
     }), 
     countDown: Ember.Route.extend({ 
      connectOutlets: function (router, context) { 
       router.get('applicationController').connectOutlet('body', 'CountDown',  { wontAppear: "5" }); 
      } 
     }) 
    }) 
}) 
}); 


Quiz.initialize(); 

的意見是設置這樣的：

<script type="text/x-handlebars" data-template-name="App"> 
    <div id="quiz-container"> 
     <div id="headerPanel"> 
      <div class="title">{{titlebar}}</div> 
      <div class="timerDiv"> </div> 
      <div class="timerDivText"></div> 
     </div> 
     {{outlet body}} 
    </div> 
</script> 
<script type="text/x-handlebars" data-template-name="Intro"> 
    <div id="introPanel"> 
     <img id="helpimg" src="images/helpimage.jpg" /> 
     <button id="startButton" {{action "countDown" on="click"}}>Start Game</button> 
    </div> 
</script> 

<script type="text/x-handlebars" data-template-name="CountDown"> 
    <div class="countdown"> 
     {{wontAppear}} 
    </div> 
</script> 

我可以得到數據，以顯示在視圖中的唯一方法是將其添加到應用控制器。我認爲倒計時視圖會從相應的countdownController獲取數據？

Answer 1

我想你（以及你正在閱讀的示例the primer）在應用程序名稱空間中缺少新添加的屬性。

灰燼現在會自動開始對自己的應用程序，這樣你就不會需要調用App.initialize()（Quiz.initialize()在你的情況下），但是，如果你想/需要，您可以將您的應用程序的autoinit設置爲假，您將不會有任何問題調用App.initialize()。如果您沒有將其設置爲false並調用初始化，Ember將拋出一個異常，說您無法多次調用初始化。

另一件事，命名/套慣例做的事情，當你使用任何框架的工作，它不是與Ember不同，所以你connectOutlet應該是這樣的：

// ... other code 
// note that "countDown" starts with a lower cased "c" 
router.get('applicationController') 
     .connectOutlet(
      'body', /* outlet name*/ 
      'countDown', /* view/controller pair name in cammelCase */ 
      { wontAppear: "5" } /* your context object*/ 
    ); 
// ... other code 

您的應用程序仍然會拋出一個錯誤：

Uncaught TypeError: Property '#' of object # is not a function

但我不知道那是什麼的，我只是想解決這個具體問題與connectOutlet在countDown呼叫路由。

見這個例子