Bootstrap Modal不適用於我（Ember JS）

Question

我正在嘗試使用Bootstrap作爲燼插件https://github.com/ember-addons/bootstrap-for-ember，但並非每個設置都適用於我。例如，當我嘗試使用簡單的警報功能，它爲我的作品，但是當我嘗試使用帶有按鈕的點擊操作模式我得到這個錯誤：

Uncaught Error: Nothing handled the action 'didAlertClose'. If you did handle the action, this error can be caused by returning true from an action handler in a controller, causing the action to bubble. 

這裏是內部模板，模態代碼：

<script type="text/x-handlebars" id="cards/index"> 
    {{bs-button title="Show Modal" clicked="show"}} 
     {{#bs-modal name="myModal" fade=true footerButtonsBinding="myModalButtons" title="My Modal"}} 
      <p>Modal content!</p> 
     {{/bs-modal}} 
</script> 

我使用的是以下版本：handlebar 1.3.0 jquery 1.9.1 ember 1.3.1

我在Ubuntu 12.04上使用chrome。

這是包含文件的層次結構：

<!--Alert component --> 
    <script src="dist/js/bs-alert.min.js"></script> 
    <script src="dist/js/bs-basic.min.js"></script> 
    <script src="dist/js/bs-button.min.js"></script> 
    <script src="dist/js/bs-modal.min.js"></script> 
    <script src="js/app.js"></script> 

有誰知道我怎麼能解決這個問題呢？

Answer 1

需要在控制器中實現「顯示」操作，並且控制器的名稱必須正確（取決於路由器/模板名稱）。這裏是我的代碼：模板代碼：

模板代碼：

{{bs-button title="Show Modal" clicked="show"}} 
       {{#bs-modal name="myModal" fade=true footerButtonsBinding="myModalButtons" title="My Modal"}} 
        <p>Modal content!</p> 
       {{/bs-modal}} 

控制器代碼：

Cards.CardsController = Ember.ObjectController.extend({ 
    myModalButtons: [ 
     {title: 'Submit', clicked: "submit"}, 
     {title: 'Cancel', clicked: "cancel", dismiss: 'modal'} 
    ], 
    actions: { 
     changeClass: function() { 
      this.set('isActive', !this.get('isActive')); 
     } 
    }, 
    isActive: false 
}); 

Cards.CardsIndexController = Ember.ObjectController.extend({ 
    myModalButtons: [ 
     {title: 'Submit', clicked: "submit"}, 
     {title: 'Cancel', clicked: "cancel", dismiss: 'modal'} 
    ], 
    actions: { 
     show: function() { 
      return Bootstrap.ModalManager.show('myModal'); 
     }, 
     submit: function() { 
      Bootstrap.NM.push('Successfully submitted modal', 'success'); 
      return Bootstrap.ModalManager.hide('myModal'); 
     }, 
     //Cancel the modal, we don't need to hide the model manually because we set {..., dismiss: 'modal'} on the button meta data 
     cancel: function() { 
      return Bootstrap.NM.push('Modal was cancelled', 'info'); 
     } 
    }, 
    isActive: false 
});