查看不显示Manifest.json中的模型数据

时间：2017-01-25 01:05:31

标签： data-binding sap manifest sapui5

我正在尝试设置我的应用描述符文件（manifest.json）以在其“models”对象中包含命名模型“inputs”。根据我的理解，在这样做之后，当提供正确的路径时，模型应该在整个应用程序中可用（请参阅XML视图）。

我想设置manifest.json的原因是因为这是配置所有模型的最佳实践。

在控制器中，我想获取然后设置manifest.json中定义的'inputs'模型 - 但是如何做到这一点？

manifest.json （我已经配置了'输入'模型）

{
    "_version": "1.1.0",
    "sap.app": {
        "_version": "1.1.0",
        "id": "pricingTool",
        "type": "application",
        "applicationVersion": {
            "version": "1.0.0"
        },
        "title": "{{appTitle}}",
        "description": "{{appDescription}}",
        "ach": "ach",
        "resources": "resources.json",
        "sourceTemplate": {
            "id": "ui5template.basicSAPUI5ApplicationProject",
            "version": "1.30.3"
        },
    },

    "sap.ui": {
        "_version": "1.1.0",
        "technology": "UI5",
        "icons": {
            "icon": "",
            "favIcon": "",
            "phone": "",
            "phone@2": "",
            "tablet": "",
            "tablet@2": ""
        },
        "deviceTypes": {
            "desktop": true,
            "tablet": true,
            "phone": true
        },
        "supportedThemes": [
            "sap_hcb",
            "sap_bluecrystal"
        ]
    },

    "sap.ui5": {
        "_version": "1.1.0",
        "rootView": {
            "viewName": "pricingTool.view.Main",
            "type": "XML"
        },
        "dependencies": {
            "minUI5Version": "1.30.0",
            "libs": {
                "sap.ui.core": {},
                "sap.m": {},
                "sap.ui.layout": {}
            }
        },
        },
        "contentDensities": {
            "compact": true,
            "cozy": true
        },
        "models": {
            "inputs": {
                        "type": "sap.ui.model.json.JSONModel",
                        "uri":  "model/inputs.json"
            },

        },
    }

Main.controller.js （应在清单文件中设置'输入'模型）

sap.ui.define([
        'jquery.sap.global',
        'sap/ui/core/mvc/Controller',
        'sap/ui/model/json/JSONModel',
        'sap/ui/model/Filter',
        'sap/ui/model/FilterOperator',
        'sap/m/MessageToast',
        'pricingTool/model/viewControls',
        'pricingTool/model/formatter',
        'pricingTool/model/Utility',
        'sap/ui/core/util/Export',
        'sap/ui/core/util/ExportTypeCSV',
    ],

    function (jQuery, Controller, JSONModel, Filter, FilterOperator, MessageToast, viewControls, formatter, Utility, Export, ExportTypeCSV) {

        "use strict";

        var mainController = Controller.extend("pricingTool.controller.Main", {

            onInit: function(oEvent) {

                //define named/default model(s)
                var inputs = new JSONModel("./model/inputs.json");

                //set model(s) to current xml view
                this.getView().setModel(inputs, "inputs");

//this is one solution I have tried, but doesn't do anything: 
// this.getView().setModel(this.getOwnerComponent().getModel("inputs"), "inputs");

//another solution I have tried:
//var inputs = this.getModel('input')  <--I was hoping this would find the inputs defined in the manifest.json, but this doesn't work either
// this.getView().setModel(inputs, "inputs");


            },

            ...

inputs.json 

{
    "propA" : "testVal"
}

XML视图 

<Button text="{inputs>propA}"></Button>

Components.js （不确定在Component.js中要做什么）

sap.ui.define([
            'sap/ui/core/UIComponent'
    ],
    function(UIComponent) {
    "use strict";


    var Component = UIComponent.extend("pricingTool.Component", {

        metadata : {

            metadata : {
                manifest: "json"
            },
            rootView : "pricingTool.view.Main",
            dependencies : {
                libs : [
                    "sap.m",
                    "sap.ui.layout"
                ]
            },
            config : {
                sample : {
                    files : [
                        "Main.view.xml",
                        "Main.controller.js"
                    ]
                }
            }
        },

        init : function () {
            // call the init function of the parent
            UIComponent.prototype.init.apply(this, arguments);

        }
    });

    return Component;

});

问题是当我在按钮控件上测试时，不会显示模型属性（“propA”）。谁能告诉我为什么模型没有在应用程序中显示？

总结问题

如何在manifest.json中定义模型，然后在控制器中设置该模型，以便在xml视图中使用它？

3 个答案:

答案 0 :(得分：3)

尝试在属性名称之前添加正斜杠... 

<Button text="{inputs>/propA}"></Button>

...并更新您的清单文件，以便您的模型定义指向在sap.app下定义的dataSource，如下所示...... 

{
"_version": "1.1.0",
"sap.app": {
    "_version": "1.1.0",
    "id": "pricingTool",
    "type": "application",
    "applicationVersion": {
        "version": "1.0.0"
    },
    "title": "{{appTitle}}",
    "description": "{{appDescription}}",
    "ach": "ach",
    "resources": "resources.json",
    "sourceTemplate": {
        "id": "ui5template.basicSAPUI5ApplicationProject",
        "version": "1.30.3"
    },
    "dataSources": {
        "inputsData": {
            "type" : "JSON",
            "uri": "model/inputs.json"
        }
    }
},

"sap.ui": {
    "_version": "1.1.0",
    "technology": "UI5",
    "icons": {
        "icon": "",
        "favIcon": "",
        "phone": "",
        "phone@2": "",
        "tablet": "",
        "tablet@2": ""
    },
    "deviceTypes": {
        "desktop": true,
        "tablet": true,
        "phone": true
    },
    "supportedThemes": [
        "sap_hcb",
        "sap_bluecrystal"
    ]
},

"sap.ui5": {
    "_version": "1.1.0",
    "rootView": {
        "viewName": "pricingTool.view.Main",
        "type": "XML"
    },
    "dependencies": {
        "minUI5Version": "1.30.0",
        "libs": {
            "sap.ui.core": {},
            "sap.m": {},
            "sap.ui.layout": {}
        }
    },
    "contentDensities": {
        "compact": true,
        "cozy": true
    },
    "models": {
        "products": {
            "type": "sap.ui.model.json.JSONModel",
            "uri":  "model/products.json"
        },
        "inputs": {
                    "type": "sap.ui.model.json.JSONModel",
                    "dataSource" : "inputsData"
        }
      }
    }
}

...更改您的Component.js文件以指向您的清单文件...... 

sap.ui.define([
        'sap/ui/core/UIComponent'
    ],
    function(UIComponent) {
    "use strict";


    var Component = UIComponent.extend("pricingTool.Component", {

        metadata : {
            manifest: "json",
        },

        init : function () {
            // call the init function of the parent
            UIComponent.prototype.init.apply(this, arguments);

        }
    });
});

...并删除控制器中的onInit逻辑以设置模型（这由组件处理）

答案 1 :(得分：1)

您在manifest.json文件中定义的模型是在Component上下文中创建的（如果您的应用基于Component）。要使其在XML视图中可用，您必须从Component获取它，然后附加到视图。您可以在onInit控制器事件中使用的代码段如下所示：

this.getView().setModel(this.getOwnerComponent().getModel("<your_model_name>"), "<your_model_name>");

如果您使用的是标准模板，那么很可能您将BaseController作为祖先，在这种情况下代码看起来会更短：

this.setModel(this.getComponentModel("<your_model_name>"), "<your_model_name>");

答案 2 :(得分：1)

以下是您希望实现的最佳示例：https://embed.plnkr.co/l1XF5O/

  • manifest.json中定义的模型（又名。＆＃34; app描述符＆＃34;）将被设置为组件（自v1.30起）。
  • 如果使用了描述符，则不推荐使用除metadata以外的组件manifest: "json"的几乎所有属性，并应予以避免。列出了不推荐使用的属性here。
  • 组件实例化的根视图内的视图（及其内部控件）会自动从组件继承模型。因此，不再需要明确地将模型设置到视图中。您的视图已经知道设置为组件的模型。*
  • 应根据您的具体情况正确使用绑定语法：
    • 仅当父控件已经绑定了上下文时才使用相对绑定语法（modelName>property）（例如，父控件使用聚合绑定或元素绑定）。
    • 在其他情况下，请使用绝对绑定语法。它以斜杠（modelName>/property）开头，因此控件不会查找其父级的绑定上下文。

*尽管可以在XMLView中无缝使用在组件上设置的模型，但通过在 onInit 处理程序中调用view.getModel来检索组件模型将返回{{1 }}。更多相关信息：https://stackoverflow.com/a/43941380/5846045

相关问题
最新问题