在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，并在模板中使用来显示加载器。

理想的解决方案是在模型中使用promise-作为异步ajax或ember-data并使用loading substates显示加载程序。