SAPUI5结合数据片段XML



我想将数据json绑定到片段包含列表项目。

uraianlist.fragment.xml:

<core:FragmentDefinition
    class="sapUiSizeCompact"
    xmlns="sap.m"
    xmlns:core="sap.ui.core">
    <Dialog
        noDataText="No Products Found"
        title="Uraian"
        search="handleSearch"
        confirm="handleClose"
        close="handleClose"
        items="{
            path: 'list>/'
        }" >
        <List
            title="{list>Name}"
            description="{list>ProductId}"
            iconDensityAware="false"
            iconInset="false"
            type="Active" />
    </Dialog>
</core:FragmentDefinition>

控制器:

 listButton : function(oEvent){
        this._oDialog = sap.ui.xmlfragment("com.taspen.acb.modules.Dosir.UraianList", this);
        this._oDialog.setModel(this.getView().getModel());
        this._oDialog.open();
        var view = this;
        var data = [
            {"Name":"1","ProductId":"Atasan1"},
            {"Name":"2","ProductId":"Atasan2"},
            {"Name":"3","ProductId":"Atasan3"}
            ]
        var oModel = new JSONModel(data);
        view.getView().setModel(oModel, "list");      
  }

我想要单击按钮(listButton函数)时,我打开片段和绑定数据列表,但数据未显示。如何修复它?

问候,鲍比

您的代码有一些错误。

  1. 对话框具有汇总'content' - 可以存储任何类型的控件。因此,您列出了对话框的"内容"聚合。
  2. 列表具有汇总项目,可以容纳您的不同类型的ListItem(例如StandardListItem,DiaplayListItem,InputListItem等)。
  3. 作为一种好的做法,将对话框作为视图添加为依赖性,以便您的对话框可以使用视图中定义的所有模型。

您以某种方式写了几乎正确的属性,但在错误的控件中。

这是校正的代码:

片段:

<core:FragmentDefinition
    class="sapUiSizeCompact"
    xmlns="sap.m"
    xmlns:core="sap.ui.core">
    <Dialog  id="UraianListDialog"> <!-- id provided so I dont have to create new Dialog Everytime -->
            <content>
                <List
                noDataText="No Products Found"
                title="Uraian"
                search="handleSearch"
                confirm="handleClose"
                close="handleClose"
                items="{
                    path: 'list>/'
                }" >
                    <StandardListItem
                        title="{list>Name}"
                        description="{list>ProductId}"
                        iconDensityAware="false"
                        iconInset="false"
                        type="Active" />
                </List>
            </content>
        </Dialog>
</core:FragmentDefinition>

控制器:

    onInit: function() {
        //Create Models in Init so they are not created everytime you open your dialog
         var data = [
                        {"Name":"1","ProductId":"Atasan1"},
                        {"Name":"2","ProductId":"Atasan2"},
                        {"Name":"3","ProductId":"Atasan3"}
                        ];
                    var oModel = new sap.ui.model.json.JSONModel(data);
                    this.getView().setModel(oModel, "list"); 
        },
 listButton : function(oEvent){
         var oView = this.getView();
         var oDialog = oView.byId("UraianListDialog");
         // create dialog lazily
         if (!oDialog) {
            // create dialog via fragment factory
            oDialog = sap.ui.xmlfragment(oView.getId(), "com.taspen.acb.modules.Dosir.UraianList");
            oView.addDependent(oDialog);
         }

         oDialog.open();
      }
}

您不能在JSONMODEL数据的根上有一个数组

另外,您应该添加片段作为视图的依赖性,并且不需要明确为片段设置模型:)

查看更新:

<core:FragmentDefinition
    class="sapUiSizeCompact"
    xmlns="sap.m"
    xmlns:core="sap.ui.core">
    <Dialog
        noDataText="No Products Found"
        title="Uraian"
        search="handleSearch"
        confirm="handleClose"
        close="handleClose"
        items="{list>/items}" >
        <List
            title="{list>Name}"
            description="{list>ProductId}"
            iconDensityAware="false"
            iconInset="false"
            type="Active" />
    </Dialog>
</core:FragmentDefinition>

将控制器更改为:

listButton : function(oEvent){
    var data = {
        items: [
            {"Name":"1","ProductId":"Atasan1"},
            {"Name":"2","ProductId":"Atasan2"},
            {"Name":"3","ProductId":"Atasan3"}
         ]
    }
    var oModel = new JSONModel(data);
    this.getView().setModel(oModel, "list"); 
    this._oDialog = sap.ui.xmlfragment("com.taspen.acb.modules.Dosir.UraianList", this);
    this.getView().addDependent(this._oDialog);
    this._oDialog.open();
}

最新更新