我正在尝试使用Bootstrap for ember addon
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>
我使用以下版本:把手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>
有谁知道我该如何解决这个问题?
解决方法
需要在控制器中实现“显示”操作,控制器的名称必须是正确的(取决于路由器/模板名称.).这是我的代码:模板代码:
模板代码:
{{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',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 });