使用 OData 模型在间隔时间更改 table 的单元格

Question

我有这段代码，我需要 table 显示前 10 名患者，并在 10 秒后显示接下来的 10 名患者，而无需触摸任何按钮（自动）。

我正在寻找与此类似的内容：https://embed.plnkr.co/ioh85m5OtPmcvPHyl3Bg/

但是使用 OData 模型（在我的视图和控制器上指定）。

这是我的观点：

<Table id="tablaPacientes" items="{/EspCoSet}">
  <columns>
    <!-- ... -->
  </columns>
  <ColumnListItem>
    <ObjectIdentifier title="{Bett}" />
    <!-- ... -->
  </ColumnListItem>
</Table>

这是我的控制器：

onInit: function () {
  var oModel = this.getOwnerComponent().getModel("zctv");
  this.getView().setModel(oModel);
},

onBeforeRendering: function () { // method to get the local IP because I need it for the OData
  var ipAddress;
  var RTCPeerConnection = window.webkitRTCPeerConnection || window.mozRTCPeerConnection;
  var self = this;

  function grepSDP (sdp) {
    var ip = /(192\.168\.(0|\d{0,3})\.(0|\d{0,3}))/i;
    sdp.split('\r\n').forEach(function (line) {
      if (line.match(ip)) {
        ipAddress = line.match(ip)[0];
        self.setIp(ipAddress);
      }
    });
  }

  if (RTCPeerConnection) {
    (function () {
      var rtc = new RTCPeerConnection({
        iceServers: []
      });
      rtc.createDataChannel('', {
        reliable: false
      });
      rtc.onicecandidate = function (evt) {
        if (evt.candidate) {
          grepSDP(evt.candidate.candidate);
        }
      };
      rtc.createOffer(function (offerDesc) {
        rtc.setLocalDescription(offerDesc);
      }, function (e) {
        console.log("Failed to get Ip address");
      });
    })();
  }
},

setIp: function (ip) {
  this.getView().byId("planta").bindElement({
    path: "/CenTVSet('" + ip + "')"
  });
  var oModel = this.getView().getModel();
  var that = this;
  oModel.read("/CenTVSet('" + ip + "')", {
    success: function (oData, oRes) {
      var einri = oData.Einri;
      var orgpf = oData.Orgpf;
      var oTable = that.getView().byId("tablaPacientes");
      var oBinding = oTable.getBinding("items");
      var aFilters = [];
      var filterO = new Filter("Orgna", sap.ui.model.FilterOperator.EQ, orgpf);
      aFilters.push(filterO);
      var filterE = new Filter("Einri", sap.ui.model.FilterOperator.EQ, einri);
      aFilters.push(filterE);
      oBinding.filter(aFilters);
    }
  });
}

我搜索了一些函数，例如 IntervalTrigger，但我真的不知道如何将它用于此示例。

Answer 1

您可以使用 bindItems 绑定项目，传递 skip、top 参数并将整个内容包装在 setInterval

var iSkip = 0;
var iTop = 10;
setInterval(function() {

    table.bindItems("/EspCoSet", {
        urlParameters: {
            "$skip": iSkip.toString() // Get first 10 entries
            "$top": iTop.toString()
        },
        success: fuction (oData) {
            iSkip = iTop; // Update iSkip and iTop to get the next set
            iTop+= 10;
        }
        ...
    }, 10000); // Each 10 seconds
)

几乎是一样的，只是使用oModel.read将实体读入你的viewModel.allEntities，将你的table绑定到viewModel.shownEntities并使用setInterval来获取allEntities 中的下 10 个要更新 shownEntities。

Answer 2

这是一个小 示例：https://embed.plnkr.co/4zIAH7q2E0lngbyX

startList: function(listBase, $skip, $top, restInfo) {
  let startIndex = $skip;
  let length = $top;
  let totalSize;
  (function repeat(that) {
    const bindingInfo = Object.assign({ startIndex, length }, restInfo);
    listBase.bindItems(bindingInfo);
    listBase.data("repeater", event => {
      totalSize = event.getParameter("total"); // $count value
      startIndex += $top;
      startIndex = startIndex < totalSize ? startIndex : 0;
      setTimeout(() => repeat(that), 2000);
    }).attachEventOnce("updateFinished", listBase.data("repeater"), that);
  })(this);
},

stopList: function(listBase) {
  listBase.detachEvent("updateFinished", listBase.data("repeater"), this);
},

该示例使用 OData V4 TripPin 服务，但同样适用于任何 OData V2 兼容服务（使用模拟服务器和真实 V2 服务进行测试）。我在 OData V2 案例的控制器中添加了注释。

该示例在列表绑定信息中使用 startIndex 和 length，这些信息转换为实体请求的 $skip 和 $top 系统查询 URL.因此，请确保您的 OData 服务支持 $skip 和 $top。 IE。将这些系统查询附加到请求 URL（例如 https://<host>/<service>/<EntitySet>?$skip=3&$top=3），应该 return 正确的实体集 like this.

列表绑定信息的其他选项可以在我解释的 UI5 文档中找到。

JavaScript部分

间隔是通过 IIFE（立即调用的函数表达式）结合 setTimeout 而不是 setInterval.

实现的

set<strong>Interval</strong>有以下缺点：

回调不会立即被调用。您必须先等待 10 秒才能触发第一次回调。
不等待数据响应到达。这可能会导致跳过一批或显示它的时间太短，因为无论服务器响应如何，延迟都会继续。

set<strong>Timeout</strong> 反而在下一批请求时提供更好的控制。

使用 OData 模型在间隔时间更改 table 的单元格

Change the cells of a table in an interval time using OData model

javascript

odata

sapui5

settimeout

intervals

JavaScript部分