Buscar..


Parámetros

Parámetro Detalle
camino Ruta del objeto o lista de objetos que se incluirán en la agregación.
fábrica Función que creará el elemento de vista de la agregación.
clasificador Objeto que representa la forma en que se ordenarán los objetos de agregación.

Enlace de agregación usando plantillas en xmlview

XmlView:

<mvc:View
    controllerName="sap.m.sample.ListCounter.List"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns="sap.m">
    <List
        headerText="Products"
        items="{products>/Products}">
        <!-- Template of the list item -->
        <StandardListItem
            title="{Name}"
        />
    </List>
</mvc:View>

Controlador:

sap.ui.define([
        'jquery.sap.global',
        'sap/ui/core/mvc/Controller',
        'sap/ui/model/json/JSONModel'
    ], function(jQuery, Controller, JSONModel) {
    "use strict";
 
    var ListController = Controller.extend("sap.m.sample.ListCounter.List", {
 
        onInit : function (evt) {
            // Model
            var oModel = new JSONModel("/products.json"));
            this.getView().setModel(oModel,"products");
        }
    });
 
 
    return ListController;
 
});

productos.json:

{ 
    Products : [
        {"Name": "Product 1"},
        {"Name": "Product 2"},
        {"Name": "Product 3"},
        ]
}

Enlace de agregación con clasificación y filtros estáticos.

<mvc:View
    controllerName="sap.m.sample.ListCounter.List"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns="sap.m">
    <List
        headerText="Fruits"
        items="{path:'products>/Products', sorter:{path:'Name'}, filter:{path:'Type', operator:'EQ',value1:'Fruit'}}">
        <!-- Template of the list item -->
        <StandardListItem
            title="{Name}"
        />
    </List>
    <List
        headerText="Food"
        items="{path:'products>/Products', sorter:{path:'Name'}, filter:{path:'Type', operator:'EQ',value1:'Food'}}">
        <!-- Template of the list item -->
        <StandardListItem
            title="{Name}"
        />
    </List>
</mvc:View>

Controlador:

sap.ui.define([
        'jquery.sap.global',
        'sap/ui/core/mvc/Controller',
        'sap/ui/model/json/JSONModel'
    ], function(jQuery, Controller, JSONModel) {
    "use strict";
 
    var ListController = Controller.extend("sap.m.sample.ListCounter.List", {
 
        onInit : function (evt) {
            // Model
            var oModel = new JSONModel("/products.json"));
            this.getView().setModel(oModel,"products");
        }
    });
 
 
    return ListController;
 
});

productos.json:

{ 
    Products : [
        {"Name": "Banana", "Type": "Fruit"},
        {"Name": "Meat", "Type":"Food"},
        {"Name": "Apple", "Type": "Fruit"},
        {"Name": "Rice", "Type": "Food"},
        ]
}

Enlace de agregación con función de fábrica

XmlView:

<mvc:View
    controllerName="sap.ui.demo.wt.controller.App"
    xmlns="sap.m"
    xmlns:mvc="sap.ui.core.mvc"
    displayBlock="true">
    <App>
        <pages>
            <Page content="{path:'Tiles>/Tiles',factory:'.tileFactory'}">
                
            </Page>
        </pages>
    </App>
</mvc:View>

Controlador:

sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/json/JSONModel"
], function (Controller, JSONModel) {
    "use strict";

    return Controller.extend("sap.ui.demo.wt.controller.App", {

        onInit: function(){
            var oModel  = new JSONModel("./model/data.json");
            
            this.getView().setModel(oModel,"Tiles");
        },
        tileFactory: function(sId,oContext){
            var oUIControl = null;
            
            var type = oContext.getProperty("type");
            
            switch(type){
                case "STD":
                    var title = oContext.getProperty("Title");
                    oUIControl = new sap.m.StandardTile();
                    
                    oUIControl.setTitle(title);
                    break;
                case "NEWS":
                    var title = oContext.getProperty("Title");
                    var newsContent = new sap.m.NewsContent({contentText:title});
                    oUIControl = new sap.m.GenericTile();
                    oUIControl.addTileContent(new sap.m.TileContent({content:newsContent}));
                    break;
                case "IMG":
                    var src = oContext.getProperty("src");
                    var imgContent = new sap.m.ImageContent({src});
                    oUIControl = new sap.m.GenericTile();
                    oUIControl.addTileContent(new sap.m.TileContent({content:imgContent}));
                    break;
            }
            
            return oUIControl;
        
        }
    });

});

data.json:

{
    "Tiles":[
        {
        "type": "STD",
        "Title": "Standard Tile"
        },
        {
        "type": "NEWS",
        "Title": "NEWS Tile"
        },
        {
        "type": "IMG",
        "src": "https://1.bp.blogspot.com/-2YLGmdxqXMk/V58ki-s5DLI/AAAAAAAANhs/jcSRMEeJN_89vXNdrie1jDGFhF5X-yh4ACLcB/s1600/ui5.png"
        }
        ]
}


Modified text is an extract of the original Stack Overflow Documentation
Licenciado bajo CC BY-SA 3.0
No afiliado a Stack Overflow