如何在 x 秒间隔内自动请求条目 [英] How to Request Entries Automatically in x Seconds Intervals

问题描述

在 XML 视图中，我展示了一个 sap.m.Table，其中包含来自输​​出 ODataModel 的条目.现在前 8 个条目应该输出大约 5 秒，其余条目会自动重新加载，并以 5 秒的间隔切换，就像仪表板一样.

In an XML view, I present a sap.m.Table with entries from an output ODataModel. Now the first 8 entries should be output for about 5 seconds and the remaining entries automatically reload, and switch in 5 second intervals, like a dashboard.

这是一个例子:我有 30 个条目.

Here is an example: I have 30 entries.

1. 开始→显示条目1到8.
2. 5 秒后 → 显示条目 9 到 16.
3. 接下来的 5 秒后 → 将 17 显示为 24.
4. 接下来的 5 秒后 → 显示 25 到 30.
5. 然后从头开始重复.

1. At the beginning → Show entries 1 to 8.
2. After 5 seconds → Show entries 9 to 16.
3. After next 5 seconds → Show 17 to 24.
4. After next 5 seconds → Show 25 to 30.
5. Then repeat from the beginning.

你知道我该怎么做吗?能否在路由功能上实现，将需要的参数传递给URL?

Would you have any idea how I can do that? Could it possibly realized on the routing function with transfer of the required parameters to the URL?

推荐答案

我制作了一个 Plunker 来演示如何实现这一点:Plunker 演示.

I have made a Plunker to demonstrate how this can be achieved: Plunker Demo.

简而言之，您可以利用 ManagedObject#bindAggregation 方法.更具体地说，您使用它们重复绑定表.

In a nutshell, you can leverage the startIndex and length parameters of the ManagedObject#bindAggregation method. More specifically, you use them to bind the table repeatedly.

  this.byId("list").bindItems({
    path: "/Meetups",
    template: this.byId("template"),
    templateShareable: true,
    startIndex: start,
    length: SLICE_SIZE
  });

因为你不断地重新绑定表，你可以简单地在 XML 视图中创建模板对象作为 dependent，然后你可以通过 this.byId(...).我们需要使用 templateShareable 标志来指示模板将在进一步的绑定中重用(在下一个刻度上).

Because you continually rebinding the table, you can simply create the template object inside the XML view as a dependent, then you can access it via this.byId(...). We need to use the templateShareable flag to indicate that the template will be reused in further bindings (on the next tick).

<dependents>
  <StandardListItem id="template" title="{Title}" 
    description="{Description}" counter="{MeetupID}" />
</dependents>

关于路由，我做了两条路由:一条初始(默认")路由和一条指定起始索引(withStart")的路由.他们当然都指向同一个观点.

Regarding the routing, I made two routes: one initial ("default") route and one route which specifies the start index ("withStart"). Both of them pointing of course to the same view.

  "routes": [{
    "pattern": "",
    "name": "default",
    "target": "main"
  }, {
    "pattern": "/{start}",
    "name": "withStart",
    "target": "main"
  }]

切片"之间的转换是在 jQuery.sap.delayedCall.您还可以使用 IntervalTrigger相反，但如果视图不是第一个显示的视图，它可能会导致一些问题(因为第一个切片"可能不会在整整 5 秒内显示，这当然取决于您如何实现它).

The transition between "slices" is done with the help of jQuery.sap.delayedCall. You can also use a IntervalTrigger instead, but it might cause some problems if the view is not the first one shown (as the first "slice" might not be shown for the full 5 seconds, depending of course on how you implement it).

jQuery.sap.delayedCall(INTERVAL, this, this.onTick, [start]);

然后发生一个勾号(即当我们需要更改切片"时)，我们只需导航到 withStart 路由并增加 start 索引参数.此时，我们还可以检查是否需要再次从零开始(如果起始索引大于总计数).

Then a tick happens (i.e. when we need to change the "slice"), we simply do a navigation to the withStart route and increment the start index parameter. At this point, we can also check if we need to start from zero again (if the start index is greater than the total count).

  start += SLICE_SIZE;
  if (this.count && start >= this.count) {
    start = 0;
  }
  this.getOwnerComponent().getRouter().navTo("withStart", {start: start});

为了找出总数(以便能够确定是否应该归零)，您可以使用列表/表格的ListBinding.

In order to find out the total count (to be able to determine if you should go to zero), you can use the information from the List / Table's ListBinding.

    var oBinding = this.byId("list").getBinding("items");
    if (oBinding.isLengthFinal()) {
      this.count = oBinding.getLength();
    }

您在多视图应用程序中可能面临的一个问题是，如果用户在您的仪表板"视图和某个其他视图之间导航，delayedCall 可能会导致您再次导航回仪表板"视图(即用户可能会被困"在仪表板中).为了避免这种情况，您可以在执行 navTo 调用之前先检查视图是否可见.

One problem that you might face in a multi-view application is that, if the user navigates between your "dashboard" view and some other view, the delayedCall might cause you to navigate back again to the "dashboard" view (i.e. the user might get "trapped" in the dashboard). To circumvent this, you could check to see if the view is visible first, before doing the navTo call.

为了提高由于加载时间而导致的性能，您可以使用两种不同的方法:

For improving performance due to loading times you can use two different approaches:

1. 使用操作模式 进行绑定时的参数.将其设置为 Client 将在客户端一次加载所有条目，分页机制将在没有进一步请求的情况下完成(至少在理论上如此).

1. Use the operation mode parameter when you are doing the binding. Setting it to Client will load all entries at once on the client side and the pagination mechanism will be done without further requests (at least in theory).

  this.byId("list").bindItems({
    path: "/Meetups",
    template: this.byId("template"),
    templateShareable: true,
    startIndex: start,
    length: SLICE_SIZE,
    operationMode: OperationMode.Client
  });

1. 使用 ODataModel.read 方法，将结果存储到 JSON 模型中，然后使用 JSON 模型而不是 OData 模型来绑定列表.

1. Do an initial load of the data using the ODataModel.read method, store the results into a JSON Model and then use the JSON Model for binding the list instead of the OData Model.

var oModel = this.getView().getModel("myJsonModel");
this.getView().getModel().read("/Meetups", {
    success: function(oData) {
        oModel.setData(oData);
    }
});

这篇关于如何在 x 秒间隔内自动请求条目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！