Question

我需要加载部分html模板，就在我从templateHelper获取使用ajax的结果之后。

在我的ItemView代码中：

templateHelpers: {
  currentUserCan:  function(action) {
    $.when( currentUser.can(action) ).done(function(permission){
      return permission;
    });
  }
}

can功能：

can: function( action ){

 var defer = $.Deferred(),
 params = { .... }

 $.get( config[ 'api' ] , params)
 .done(function(response) {
    defer.resolve(response['permission'])
  })
 .fail(function(response){
    defer.resolve(false) 
  });

  return defer.promise();
}

我的模板：

<div class="large-8 columns">
  <p><% if (currentUserCan('some_action')) {  do something, console.log("can") } else { console.log('can not')}%></p>
  <p>Last Status:<%= date %></p>
</div>

<div class="large-8 columns">
...
...

由于异步ajax，我得到了未定义的结果，并且'不能'在控制台，虽然它是真的。如何在if语句中加载我的代码，只有在完成ajax之后？

Answer 1

不要尝试以“同步方式”使用异步代码。

也许，这对你来说是一个很好的解决方案：

templateHelpers: {
  currentUserCan:  function(action) { return currentUser.can(action); }
}

这里我们从函数返回promise，因为我们想对异步操作完成做出反应。

<div class="large-8 columns"> <p><% $.when(currentUserCan('some_action')).done(function(permission) { if(permission) console.log("can"); else console.log('can not'); }) %></p> <p>Last Status:<%= date %></p> </div>

这里我们从模板中使用promise。

仅在ajax完成后加载部分html视图 - 同步

1 个答案: