具有多个参数的 Fiori Master Detail App 路由
Fiori Master Detail App routing with mutliple parameters
我目前正在开发我的第一个 SAP Fiori 应用程序。
在 SAP WebIDE 中,我使用 Master Detail 从模板创建了一个项目并将其连接到我的 oData 服务。
如果我 运行 未修改的应用程序,除了没有数据加载到详细信息视图之外,一切正常,因为 oData 服务需要 2 个参数来获得唯一记录。
现在的问题是,如果我修改应用程序以使用 2 个参数并导航到详细信息视图,详细信息视图会加载,但甚至不会访问 oData 服务。 (Chrome 开发工具中没有 $batch 请求)
manifest.json
中的修改
{
"pattern": "JOBSSet/{Jobname}/{Jobcount}",
"name": "object",
"target": [
"master",
"object"
]
}
主控修改:
_showDetail : function (oItem) {
var bReplace = !Device.system.phone;
// set the layout property of FCL control to show two columns
this.getModel("appView").setProperty("/layout", "TwoColumnsMidExpanded");
this.getRouter().navTo("object", {
Jobname : encodeURIComponent(oItem.getBindingContext().getProperty("Jobname")),
Jobcount : oItem.getBindingContext().getProperty("Jobcount")
}, bReplace);
}
细节控制器的修改:
_onObjectMatched : function (oEvent) {
var sJobname = decodeURIComponent(oEvent.getParameter("arguments").Jobname);
var sJobcount = oEvent.getParameter("arguments").Jobcount;
this.getModel("appView").setProperty("/layout", "TwoColumnsMidExpanded");
this.getModel().metadataLoaded().then( function() {
var sObjectPath = this.getModel().createKey("JOBSSet", {
Jobname : sJobname,
Jobcount : sJobcount
});
this._bindView("/" + sObjectPath);
}.bind(this));
}
仅当您 运行 从第一页开始应用时才会出现此行为。
例如,如果您在智能手机上测试应用程序(或使用 Chrome 开发工具来模拟),您会看到当应用程序直接打开到详细信息页面时,会有一个网络致电以获取项目详细信息。这也是一个 $batch 调用,但在其中你会发现一个 'GET /JOBSSet(Jobname='x',Jobcount='y').
基本上会发生以下情况:默认情况下,UI5 将您的数据缓存在 Context
个对象中(假设您使用的是 v2.ODataModel
class)。当您 运行 应用程序并看到 "Jobs" 的列表时,库已经为从您的 oData 服务返回的每条记录创建了一个上下文对象。
如果稍后在应用程序中创建一个上下文对象(直接或间接,如 bindElement
方法),UI5 将检查给定路径 - /JOBSSet(Jobname='x',Jobcount='y')
。如果已经有一个 Context 链接到该路径,那么 Context 应该已经存在于主内存中。因此,不需要额外调用。
我目前正在开发我的第一个 SAP Fiori 应用程序。 在 SAP WebIDE 中,我使用 Master Detail 从模板创建了一个项目并将其连接到我的 oData 服务。
如果我 运行 未修改的应用程序,除了没有数据加载到详细信息视图之外,一切正常,因为 oData 服务需要 2 个参数来获得唯一记录。
现在的问题是,如果我修改应用程序以使用 2 个参数并导航到详细信息视图,详细信息视图会加载,但甚至不会访问 oData 服务。 (Chrome 开发工具中没有 $batch 请求)
manifest.json
中的修改 {
"pattern": "JOBSSet/{Jobname}/{Jobcount}",
"name": "object",
"target": [
"master",
"object"
]
}
主控修改:
_showDetail : function (oItem) {
var bReplace = !Device.system.phone;
// set the layout property of FCL control to show two columns
this.getModel("appView").setProperty("/layout", "TwoColumnsMidExpanded");
this.getRouter().navTo("object", {
Jobname : encodeURIComponent(oItem.getBindingContext().getProperty("Jobname")),
Jobcount : oItem.getBindingContext().getProperty("Jobcount")
}, bReplace);
}
细节控制器的修改:
_onObjectMatched : function (oEvent) {
var sJobname = decodeURIComponent(oEvent.getParameter("arguments").Jobname);
var sJobcount = oEvent.getParameter("arguments").Jobcount;
this.getModel("appView").setProperty("/layout", "TwoColumnsMidExpanded");
this.getModel().metadataLoaded().then( function() {
var sObjectPath = this.getModel().createKey("JOBSSet", {
Jobname : sJobname,
Jobcount : sJobcount
});
this._bindView("/" + sObjectPath);
}.bind(this));
}
仅当您 运行 从第一页开始应用时才会出现此行为。
例如,如果您在智能手机上测试应用程序(或使用 Chrome 开发工具来模拟),您会看到当应用程序直接打开到详细信息页面时,会有一个网络致电以获取项目详细信息。这也是一个 $batch 调用,但在其中你会发现一个 'GET /JOBSSet(Jobname='x',Jobcount='y').
基本上会发生以下情况:默认情况下,UI5 将您的数据缓存在 Context
个对象中(假设您使用的是 v2.ODataModel
class)。当您 运行 应用程序并看到 "Jobs" 的列表时,库已经为从您的 oData 服务返回的每条记录创建了一个上下文对象。
如果稍后在应用程序中创建一个上下文对象(直接或间接,如 bindElement
方法),UI5 将检查给定路径 - /JOBSSet(Jobname='x',Jobcount='y')
。如果已经有一个 Context 链接到该路径,那么 Context 应该已经存在于主内存中。因此,不需要额外调用。