【问题标题】:Is it possible to use 2 models in one view是否可以在一个视图中使用 2 个模型
【发布时间】:2017-06-04 20:38:21
【问题描述】:

我对 SAPUI5 中是否可能有一个概念感到困惑,并且由于在这种详细程度下使用文档可能有点困难,因此我在研究过程中比正常情况更早地提出了这个问题。主要是我不想花太多时间,如果立即得到“否”的回答。

我有一个使用 JSON 模型的主从视图的用例,但我必须生成自己的控件 - 我不能使用 SplitApp 等。

该模型实际上是一棵 2 层深的树,由大师通向细节。概念上是这样的:

{ 
    "master": [
        {
            "name": "Master 1",
            "detail" : [
                {
                "name": "Detail 1-1"
                },
                {
                "name": "Detail 1-2"
                }
            ]
        },
        {
            "name": "Master 2",
            "detail" : [
                {
                "name": "Detail 2-1"
                },
                {
                "name": "Detail 2-2"
                }
            ]
        }
    ]
}   

用户体验是会有一个可选择的主人列表,当做出选择时,细节列表控件将被刷新以显示所选主人的孩子的细节。

我熟悉通过以下方式将模型绑定到视图

sap.ui.getCore().setModel(oModel) 
this.getView().setModel(oModel)

但是根据我迄今为止的学习,这会将视图中的所有控件绑定到一个模型。

我认为可能值得追求的选择是:

  1. 将单独的模型绑定到每个主控件和细节控件,并编写自定义代码以在选择主控件时切换出细节模型。但是如何进行这样的绑定;
  2. 使用单个模型,但以某种方式设置细节控件以识别“当前选定的”主模型。
  3. 在细节控制上使用某种过滤器。

进一步解释 2,如果说我正在使用一个表格来显示我可能在表格 def 中的详细信息

   <Table
            id="detailList"
            items="{
                path: '/'
            }",
            ...
     >

所以我希望将路径修改为类似

path: '/master[n]/detail/'

其中 n 代表选定的主实例。

要么可能,要么有其他选择,或者我应该放弃。

编辑:我通过Michael Herzog here 找到了这个潜在的基于过滤器的解决方案。他的描述是:

我会给你一个例子,你可以如何实现 matser-detail SAPUI5 中的关系。

用例:当用户点击第一个表中的客户端时, 所有相关订单都应显示在第二个表格中。命令 应该隐藏来自其他客户的信息。

因此,在我们看来,我们有两个表:

  1. 表:客户端

  2. 表格:订单

创建两个表并设置数据绑定后,实现 第一个表上的这个事件处理程序:

oTableClients.attachRowSelectionChange( function(oEvent){

    // first, we fetch the binding context of the selected row
     var selectedRowContext = oEvent.getParameter("rowContext");
     // get the ID of the customer via rowContext. The model-object represents the data of the first table
     var selectedClientId = oModel,getProperty("id", selectedRowContext);
     // get binding of second table
     var ordersBinding = oTableOrders.getBinding();
     //create new filter to show the relevant data for the selected customer
     var oFilter = new sap.ui.model.Filter("clientId", sap.ui.model.FilterOperation.EQ, selectedClientId);
     // apply filter to binding
     ordersBinding.filter([oFilter]);
});

我可以看到这种方法对我来说是可行的 - 有什么理由说明这种模式存在根本缺陷吗?

【问题讨论】:

    标签: sapui5


    【解决方案1】:

    一般来说,您的视图可以包含您喜欢的任意数量的模型。唯一的限制是只能有一个无名模型,即所有其他模型都需要命名。以下代码显示了差异:

    this.getView().setModel(new JSONModel(data));
    this.getView().setModel(new JSONModel(data), name));
    

    要绑定命名模型,您必须在绑定指令中提供其名称,否则运行时将使用无名模型。以下示例显示了差异(请注意,您可以使用短绑定语法,除非您想提供其他参数,即您可以省略 path 属性:

    <Table items="{/path}">
    <Table items="{name>/path}">
    

    在您的示例中,我建议使用一个模型并使用绑定上下文来控制详细信息表中显示的数据。

    明细表的绑定应该是相对的,如下所示:

    <Table id="detailList" items="{detail}">
    

    用于处理主列表选择的处理程序如下:

    onMasterItemSelect : function(event) {
        // get the binding context of the currently selected master item, e.g. /master/0
        var masterBindingContext = event.getParameter("listItem").getBindingContext();
    
        // bind detail table to the selected master item using bindElement
        this.byId("details").bindElement(masterBindingContext.getPath());
    }
    

    【讨论】:

    • 谢谢 Matbtt - 我会处理这个并报告回来。并感谢 setModel() 示例 - 一个有用的提醒和方便未来的访问者。
    • 好的 - 在您的答案中应用了该方法,并且效果很好,谢谢。我做了一个更改,即在细节绑定定义中包含一个排序,所以它看起来像:items="{path: 'detail',sorter: {path: 'name'}}"。这是对name 属性的详细信息进行排序。在原始问题中未作为 req 提及,但注意格式很有用。
    • 实际上,如果您仔细观察,本地化使用类似的语法,它本身就是一个模型等:{i18n&gt;firstName}
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-12-01
    • 2018-10-29
    • 1970-01-01
    • 2016-03-14
    • 2011-04-18
    • 2013-07-13
    相关资源
    最近更新 更多