正在加载ember js中的微调器

Question

我试图在Ajax调用期间在emberJS中显示加载微调器。我的代码如下所示。我在控制器操作中发出了ajax调用。问题是在ajax调用之后显示和隐藏了gif图像。我也试过ajaxStart和ajaxStop，但没有得到预期的结果。

$.ajax({
beforeSend:function(){
$('#wait').show();
console.log("started t");
},
type:"POST",
url:"/getdata",
async:false,
data:"some",
complete:function(){
$('#wait').hide();
}
});

<div id="wait" style="height: 500px;width: 1200px;display:none">
<img src="assets/images/pageloader.gif" alt="Loading....">
</div>

有人能告诉我加载时显示图像的方法吗。谢谢你提前回答。

Answer 1

如果您出于任何原因确实需要使用同步ajax调用，简单地说，

$('#wait').show();
$.ajax();
$('#wait').hide();

将起作用。

但是，

• 不建议使用同步ajax调用
• 也不建议从路由/控制器进行UI操作

因此，折中的解决方案是使用控制器属性"show_loading"来维护ui状态，根据需要设置true或false，并在模板中使用if来显示加载器。

理想的解决方案是在模型中使用promise——作为异步ajax或ember数据，并使用加载子状态来显示加载程序。