Question

我有一个使用WCF服务（在SharePoint中）使用数据的函数。该服务不返回我需要的项目的特定字段，因此我使用SharePoint客户端对象模型通过使用我在WCF服务返回的结果中的ID来查询该字段。

function LoadAllNews() {
var listUrl = "/_vti_bin/ListData.svc/Pages";

$.getJSON(listUrl,
 function (data) {
     $.each(data.d,
      function (i, result) {
          GetImageUrl(result.Id, function (image) {
              $(ConstructHtml(image, result.Title, result.Path, result.Name)).appendTo("#News");
          });
      });
 });

}

当我在这里调试result时，我总是以相同的顺序获取返回的项目，但由于GetImageUrl执行查询异步，因此项目不会以相同的顺序附加。大部分时间他们做的事情有时候似乎是随机的，因为获得图像的时间各不相同：

function GetImageUrl(id, callback) {
    var context = new SP.ClientContext();
    var items = context.get_web().get_lists().getByTitle('Pages').getItemById(id);
    context.load(items);

    context.executeQueryAsync(function () {
        callback(items.get_item('PublishingRollupImage'));
    });
}

function ConstructHtml(imageUrl, title, path, name) {
    var html = "" // a long html string..
    return html;
}

我可以在sharepoint.stackexchange上发布这个内容，但是这里的受众范围更广，如何使用JavaScript处理这个问题比使用SharePoint本身更具问题。

关于如何处理这个问题的任何想法？我正在考虑像在LoadAllNews（）中跳过图像，然后当附加所有项目时使用JavaScript / jQuery来加载每个新闻项目的图像。

提前致谢。

Answer 1

如果事件顺序很重要，请将其作为同步程序

Answer 2

根据我对此问题的回答中的fork函数：Coordinating parallel execution in node.js。我会这样做：

var getImages = [];
var meta = [];
$.each(data.d,
  function (i, result) {
    getImages.push(function(callback){
      GetImageUrl(result.Id, callback);
    });
    meta.push({
      title : result.Title,
      path : result.Path,
      name : result.Name
    });
});

fork(getImages,function(images) {
  $.each(images,function(i,image){
      $(ConstructHtml(
          image,
          meta[i].title,
          meta[i].path,
          meta[i].name
      )).appendTo("#News");
   });
});

fork的实施就是这样：

function fork (async_calls, shared_callback) {
  var counter = async_calls.length;
  var all_results = [];
  function makeCallback (index) {
    return function () {
      counter --;
      var results = [];
      // we use the arguments object here because some callbacks 
      // in Node pass in multiple arguments as result.
      for (var i=0;i<arguments.length;i++) {
        results.push(arguments[i]);
      }
      all_results[index] = results;
      if (counter == 0) {
        shared_callback(all_results);
      }
    }
  }

  for (var i=0;i<async_calls.length;i++) {
    async_calls[i](makeCallback(i));
  }
}

上面的fork函数按顺序收集异步结果，因此它完全符合您的要求。

JavaScript循环中的回调会导致问题

2 个答案: