讓{{action}}在ember.js中工作

我有一個簡單的Ember應用程序，但花了5個小時纔得到{{action}}而沒有任何運氣。我已經嘗試了所有我能想到的3次，但我被卡住了。我有最少的路由器。有一個index.handlebars默認顯示在{{outlet}}中，並且有一個指向定價頁面的鏈接，當點擊成功時，轉換到定價頁面。在定價頁面中，我嘗試了a和a以包含在PricingController中具有相應方法的{{action showMessage}}。在Chrome瀏覽器中查看餘燼擴展，我可以看到PricingController確實與視圖相關聯。但該方法從未被調用過。我真的不知道還有什麼要嘗試的。讓{{action}}在ember.js中工作

的application.handlebars：

<div class='navbar navbar-inverse navbar-fixed-top'> 
    <div class='navbar-inner'> 
    <div class='container'> 
     <div class='nav-collapse collapse'> 
     <ul class='nav'> 
      <li>{{#linkTo 'pricing'}}Prijzen{{/linkTo}}</li> 
     </ul> 
     </div> 
    </div> 
    </div> 
</div> 
<div class='container' id='main'> 
    <div class='content'> 
    <div class='row'> 
     <div class='span12'> 
     <div class='page-header'></div> 
     {{outlet}} 
     </div> 
    </div> 
    </div> 
</div> 

App.Router.map(function() { 
    this.route('pricing'); 
}); 


App.ApplicationRoute = Ember.Route.extend({ 
}); 


App.PricingRoute = Ember.Route.extend({ 
});

pricing.handlebars：

<h1>some text</h1> 
<a href="#" {{action showMessage}} class='btn btn-primary btn-large'>order</a> 
<button {{action showMessage}}></button> 

App.PricingController = Ember.Controller.extend({ 
    showMessage: function() { 
    toastr.info('info'); 
    } 
});

來源

2013-02-28 Rudi

您的代碼在最新的emberRCjs和handlebarsrc3中正常工作。你使用哪個版本的燼和把手？

來源

2013-02-28 14:38:01 Dinesh

請參閱此小提琴：http：//jsfiddle.net/facfu/8/ – Dinesh 2013-02-28 14:38:47

感謝您花時間創作小提琴。不知道發生了什麼事，並停止了服務器幾次，還有瀏覽器。我正在用燼路軌「頭」。我只是在另一個地方做了它，它馬上就開始工作。 – Rudi 2013-02-28 14:45:26

您可以檢查線索JS控制檯，我的猜測是，這應該被扔「showMessage沒有處理「錯誤。這是因爲默認情況下的{{行動}}幫手目標的當前路徑不是控制器

您可以移動showMessage功能的事件對象的路線

App.PricingRoute = Ember.Route.extend({ 
    events: { 
    showMessage: function() { 
     toastr.info('info'); 
    } 
    } 
});

或設定行動的目標到控制器

<a href="#" {{action showMessage target="controller"}}>Show</a>

來源

2013-02-28 12:54:39

謝謝布拉德利。控制檯中沒有錯誤消息。我確實試圖指定目標，我會再給它一次。 [ember docs]（http://emberjs.com/guides/templates/actions/）仍然將控制器作爲默認目標。 – Rudi 2013-02-28 13:49:44

讓{{action}}在ember.js中工作

回答

相關問題