我在应用程序模板中有两个按钮,用于触发控制器中的不同操作。我想设置ladda.js以向按钮添加微调器,而相应操作中的ajax函数正在等待解析。但要开始拉达,我必须做这样的事情......
$('#form-submit').click(function(e){
e.preventDefault();
var l = Ladda.create(this);
l.start();
});
所以在我的控制器中,我有一个典型的动作设置启动ajax功能。但是什么是获得触发动作的按钮的最佳方式,所以我可以像上面显示的那样启动ladda?
此处参考模板中的按钮
// templates/application.hbs
<li class="navbar-right"><button {{action 'startBot'}} class="btn btn-success ladda-button" data-style="slide-down"><span class="ladda-label">Start Bot</span></button><button {{action 'stopBot'}} class="btn btn-danger ladda-button" data-style="slide-down"><span class="ladda-label">Stop Bot</span></button></li>
这些是控制器中的动作
// controllers/application.js
isConnected: false,
actions: {
startBot: function(){
var self = this;
console.log('starting bot');
Ember.$.ajax({
method: 'post',
dataType: 'json',
url: 'http://localhost:3000/api/v1/bot',
success: function(data) {
console.log(data);
self.toggleProperty('isConnected');
self.get('notify').success('Bot started');
},
error: function(err) {
console.log(err);
self.get('notify').error('There was a problem');
}
});
},
stopBot: function(){
var self = this;
console.log('stoping bot');
Ember.$.ajax({
method: 'delete',
dataType: 'json',
url: 'http://localhost:3000/api/v1/bot',
success: function(data) {
console.log(data);
self.toggleProperty('isConnected');
self.get('notify').success('Bot stopped');
},
error: function(err) {
console.log(err);
self.get('notify').error('There was a problem');
}
});
},
}