如何将事件（在本例中为按钮单击）传递给片段以显示与特定行关联的数据？

Question

我正在开发一个 SAPUI5 应用程序，并且我有一个从 oData 服务获取的项目表。 我需要在一个按钮上显示与特定行相关的详细信息，单击一个片段。

Answer 1

使用getBindingContext()将行数据绑定到 Dialog。

查看.xml

<Button text="Show Detail" press="bindDialog"/>

详细信息SFDialog.fragment.xml

<core:FragmentDefinition
    xmlns="sap.m"
    xmlns:l="sap.ui.layout"
    xmlns:f="sap.ui.layout.form"
    xmlns:core="sap.ui.core">
    <Dialog title="SF title">
        <f:SimpleForm 
           editable="true"
           layout="ResponsiveGridLayout"
           labelSpanL="4"
           labelSpanM="4"
           labelSpanS="12"
           adjustLabelSpan="false"
           emptySpanL="0"
           emptySpanM="0"
           emptySpanS="0"
           columnsL="1"
           columnsM="1"
           singleContainerFullSize="false" >
            <f:content>
                <Label text="Amount">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Label>
                <Input value="{/data/Amount}">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Input>
                <Label text="Quantity">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Label>
                <Input value="{/data/Quantity}">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Input>
                <Label text="Unit">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Label>
                <Input  value="{/data/Unit}">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Input>
                <Label text="Status">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Label>
                <Input  value="{/data/Status}">
                    <layoutData>
                        <l:GridData span="L2 M3 S6"/>
                    </layoutData>
                </Input>
            </f:content>
        </f:SimpleForm>
    </Dialog>
</core:FragmentDefinition>

controller.js

bindDialog: function(oEvent) {
  var oRowData = oEvent.getSource().getParent().getBindingContext().getObject();//get the row data
    if (!this._detailDialog) {
        this._detailDialog = sap.ui.xmlfragment("path/DetailSFDialog", this);
        this.getView().addDependent(this._detailDialog);
    }    
    var oModel = new sap.ui.model.json.JSONModel();
    oModel.setData({ "data": oRowData});
    this._detailDialog.setModel(oModel);
    this._detailDialog.open();
},

Output