使用setInterval在knockout应用程序中实现轮询？

Question

我正在尝试使用setInterval实现简单的轮询机制。我的Viewmodel如下：

define([ 'knockout', 'jquery',
    ], function ( ko, $) {
    function ViewModel() {
        var self = this;
        //setInterval( function() {
        $.ajax({url: "", async: false,timeout: 3000, success: function (data) {
           // some operation

            }, dataType: "json"});
      //}, 3000);

    }
    return ViewModel;


 });

到目前为止，ajax调用返回数据并进行操作都很好。我该如何使用setInterval让ajax调用在一定时间间隔后返回数据，以便更新ViewModel并刷新UI中的数据？如果取消注释setInterval块，则ViewModel将不会返回到DOM中。我认为setInterval是异步的。任何解决方案都将不胜感激。

- Debabrata Mohanta

---

你能在 jsfiddle 上创建一个可重现的示例吗？它们提供了一个 AJAX 回显服务，可以在示例中使用 AJAX。 - Madara's Ghost

Answer 1

基本上，在异步代码中使用 setInterval 不是最好的方法。最好使用 setTimeout 在前一个请求完成后安排新的请求。

如果确保一次只有两个待处理请求，您可以通过 self 在成功处理程序中访问 ViewModel 实例，并且您无需担心旧的/其他请求会撤消您的更改。

这是一个例子：

function ViewModel() {
  var self = this;

  var INTERVAL = 5000;
  var timeout = null;
  var currentReq = null;
  
  this.observableProp = ko.observable("empty");

  var fetchNewData = function() {
    currentReq = $.ajax( /* options */);
    
    currentReq
      .done(processNewData)
      .always(scheduleNewDataFetch);
  };

  var processNewData = function(data) {
    // self refers to your current ViewModel instance
    // set observable properties using self.prop(data)
    self.observableProp("data");
  };
  
  var scheduleNewDataFetch = function() {
    if (currentReq) {
      currentReq.abort();  
    }
    
    if (timeout) {
      clearTimeout(timeout);  
    }
    
    currentReq = null;
    timeout = setTimeout(fetchNewData, INTERVAL);
    
  };

  fetchNewData(); // Starts the update loop
}

- user3297291

---

你的解决方案很不错，但是即使使用了 define([ 'knockout', 'jquery'], function ( ko, $) { //your implementation } return ViewModel; }); ，ViewModel 仍然返回未定义。我有什么遗漏吗？ - Debabrata Mohanta

很抱歉，那是一个不同的问题，与这个问题没有真正的关联。尝试在谷歌上搜索“amd define returns undefined”，或者使用相关标签和代码提出一个新问题。可能是循环依赖，谁知道呢... - user3297291

Answer 2

你可以尝试简单地执行以下操作：

define([ 'knockout', 'jquery',
    ], function ( ko, $) {
    function ViewModel() {
        var self = this;
        var refreshInterval = /* your refresh interval in ms here*/;
        setInterval( function() {
            $.ajax({url: "", async: false, success: function (data) {
                // some operation

                timeout: refreshInterval
                }, dataType: "json"});
        }, refreshInterval);

    }
    return ViewModel;

 });

ajax调用每隔refreshInterval（以毫秒为单位）进行一次。 timeout属性是一种安全措施，确保您在一个时间间隔内获得的答案是该时间间隔的数据，而不是来自先前未回答的延迟调用的数据。

- HarmonicTons

---

ViewModel没有返回到HTML，无法工作。 - Debabrata Mohanta