UI5:向工作列表应用添加新的初始选择标准视图
UI5: Adding a new initial selection criteria view to worklist app
我下载了 UI5 工作列表模板,并尝试添加一个新视图以接受用户输入的初始选择标准。通过调整 manifest.json 中的路由器设置,我能够正确地将新视图 "Selection" 设置为初始视图,并且还添加了代码以将用户输入的条件作为过滤器对象传递给工作列表table 在 worklist.controller 的 onInit() 中想到 "Update started" table 事件,如下图所示。
问题:- 仅在用户从 "selection" 视图导航至 "worklist" 时首次应用过滤器。之后,如果用户想要返回选择视图并修改选择标准并再次执行搜索,工作列表视图将仅显示旧数据并且似乎会影响新标准。
有两种主要(好的)方法可以做到这一点,都涉及路由。
首先(更简单的解决方案),您可以简单地将代码移动到工作列表路由的 patternMatched
事件的事件处理程序中。或者,您也可以监听路由器目标的 display 事件,但我强烈建议您改用 patternMatched
路由事件。
基本上每次匹配到路由(即每次显示view)都会触发该事件。您可以按照以下方式进行操作:
onInit: function() {
// ... your current code
var oRouter = this.getOwnerComponent().getRouter();
oRouter.getRoute("worklist").attachPatternMatched(this.onRouteMatched, this);
},
// ...
onRouteMatched: function() {
var oTable = this.byId("myTable"), //replace the ID accordingly :)
aFilters = ...;
oTable.getBinding("items").filter(aFilters);
}
第二个选项基本上是第一个选项的扩展。它可能不适合您的用例(这取决于用户在第一个屏幕上可能 select 的过滤器)。您仍然需要制作相同的方法。但是,您不是直接检索第一个屏幕的 selection,而是通过路由机制传递数据。
这有一个很好的警告,如果用户刷新 window,他仍然会得到过滤视图(与第一个解决方案相反,当您在刷新后总是会得到一个未过滤的视图)。可以使用和扩展 UI5 Routing Walkthrough 中的相同基本原理(即,您必须将过滤器表示为字符串;基本上 'serializing' 它们进入 "Selection" 视图中的字符串,传递字符串到 navTo
调用中的路由器,然后 'deserializing' 工作列表视图中的字符串)。请务必查看演练的下一步。
当然,如果用户可以 select 无限或大量过滤器,则此解决方案将无法解决。
我下载了 UI5 工作列表模板,并尝试添加一个新视图以接受用户输入的初始选择标准。通过调整 manifest.json 中的路由器设置,我能够正确地将新视图 "Selection" 设置为初始视图,并且还添加了代码以将用户输入的条件作为过滤器对象传递给工作列表table 在 worklist.controller 的 onInit() 中想到 "Update started" table 事件,如下图所示。
问题:- 仅在用户从 "selection" 视图导航至 "worklist" 时首次应用过滤器。之后,如果用户想要返回选择视图并修改选择标准并再次执行搜索,工作列表视图将仅显示旧数据并且似乎会影响新标准。
有两种主要(好的)方法可以做到这一点,都涉及路由。
首先(更简单的解决方案),您可以简单地将代码移动到工作列表路由的 patternMatched
事件的事件处理程序中。或者,您也可以监听路由器目标的 display 事件,但我强烈建议您改用 patternMatched
路由事件。
基本上每次匹配到路由(即每次显示view)都会触发该事件。您可以按照以下方式进行操作:
onInit: function() {
// ... your current code
var oRouter = this.getOwnerComponent().getRouter();
oRouter.getRoute("worklist").attachPatternMatched(this.onRouteMatched, this);
},
// ...
onRouteMatched: function() {
var oTable = this.byId("myTable"), //replace the ID accordingly :)
aFilters = ...;
oTable.getBinding("items").filter(aFilters);
}
第二个选项基本上是第一个选项的扩展。它可能不适合您的用例(这取决于用户在第一个屏幕上可能 select 的过滤器)。您仍然需要制作相同的方法。但是,您不是直接检索第一个屏幕的 selection,而是通过路由机制传递数据。
这有一个很好的警告,如果用户刷新 window,他仍然会得到过滤视图(与第一个解决方案相反,当您在刷新后总是会得到一个未过滤的视图)。可以使用和扩展 UI5 Routing Walkthrough 中的相同基本原理(即,您必须将过滤器表示为字符串;基本上 'serializing' 它们进入 "Selection" 视图中的字符串,传递字符串到 navTo
调用中的路由器,然后 'deserializing' 工作列表视图中的字符串)。请务必查看演练的下一步。
当然,如果用户可以 select 无限或大量过滤器,则此解决方案将无法解决。