Question

我目前正在使用SAP UI5开发应用程序。

目前我有两个视图，一个主视图和一个详细视图，它显示一个图表，而它显示的数据取决于在主视图中选择了哪个选项。

这是详细视图控制器的相关部分：

chartData: function(param)
    {
        var view = this.getView();
        var oChart = this.getView().byId("ProductionStatistics");

        var orders = view.getModel("data").getProperty("/").Orders;

        console.log(orders);

        for (var i = 0; i < orders.length; i++)
        {
            if (orders[i].anr === param)
            {
                var details = orders[i].detail;

                console.log(details);
                var intmodel = new sap.ui.model.json.JSONModel(details);
                view.setModel(intmodel,"details");

                var set = new sap.viz.ui5.data.FlattenedDataset(
                {
                    dimensions:
                    [
                        {name: 'Bezeichnung',value: "{key}"}
                    ],
                    measures:
                    [
                        {name: 'Wert',value: "{value}"}
                    ],
                    data: "{details>/}"
                });

                oChart.setDataset(set);
            }
        }

        // $.ajax({
        //  url: "model/data.json",
        //  success: function(data, textStatus, jqXHR)
        //  {
        //      var orders = data.Orders;
        //      for (var i = 0; i < orders.length; i++)
        //      {
        //          if (orders[i].anr === param)
        //          {
        //              var chartdata = orders[i].detail;
        //              chartdata.pop(); chartdata.pop();
        //              var model = new sap.ui.model.json.JSONModel(chartdata);
        //              view.setModel(model,"chartdata");
        //
        //              var path = "data>/Orders/" + i + "/detail";
        //              var set = new sap.viz.ui5.data.FlattenedDataset(
        //              {
        //                  dimensions:
        //                  [
        //                      {name: 'Bezeichnung',value: "{key}"}
        //                  ],
        //                  measures:
        //                  [
        //                      {name: 'Wert',value: "{value}"}
        //                  ],
        //                  data: "{chartdata>/}"
        //              });
        //
        //              oChart.setDataset(set);
        //          }
        //      }
        //  },
        //  error: function(data, textStatus, jqXHR) {
        //      console.error("AJAX-ERROR \n" + textStatus + "\n" + jqXHR);
        //  }
        // });
    },

    _patternMatched: function(oEvent)
    {

        var param = oEvent.getParameter("arguments").anr;
        this.chartConfig(param);
        this.chartData(param);

    },

    onInit: function(oEvent)
    {
        var oRouter = this.getRouter();
        oRouter.getRoute("donutchart").attachMatched(this._patternMatched, this);
    },

这是JSON文件的相关部分，由＆＃34;数据＆＃34;表示。 model（我在manifest.json中将其添加为数据源）。

     "Orders":
   [
     {
       "key":"0001",
       "anr":"0001",
       "detail":
       [
         {"key":"Stat1","value":10500,"icon":"sap-icon://product"},
         {"key":"Stat2","value":1500,"icon":"sap-icon://product"},
         {"key":"Stat3","value":12,"icon":"sap-icon://product"},
         {"key":"Stat4","value":1200,"icon":"sap-icon://product"},
         {"key":"Stat5","value":6,"icon":"sap-icon://person-placeholder"}
       ],
       "worker":
       [
         {"key":"Max Mustermann","value":"Montierer","icon":"sap-icon://person-placeholder"},
         {"key":"Max Mustermann","value":"Montierer","icon":"sap-icon://person-placeholder"},
         {"key":"Max Mustermann","value":"Verpacker","icon":"sap-icon://person-placeholder"},
         {"key":"Max Mustermann","value":"Verpacker","icon":"sap-icon://person-placeholder"},
         {"key":"Max Mustermann","value":"Prüfer","icon":"sap-icon://person-placeholder"}
       ]
     },

因此，简而言之，控制器将通过加载完整的＆＃34;订单＆＃34;将正确的数据分配给图表（id：ProductionStatistics）。模型中的数组，通过每个项目并比较关键字＆＃34; anr＆＃34;使用主视图提供的参数（订单号，要显示的数据）。在匹配时，控制器会将正确的订单详细信息添加到模型＆＃34;详细信息＆＃34;，最终调用并分配给图表。

我在这里面临的问题是，此解决方案仅在我第一次加载详细信息视图时才起作用。如果我返回到主视图并使用不同的选定顺序再次加载详细视图，则图表仍将显示第一次调用视图时所选订单的数据。使用AJAX的替代解决方案（已注释掉）工作正常，但由于应用程序应该与OData服务一起使用而不是使用本地.json文件，因此这实际上不是解决方案。

是否有解决方案使控制器重新加载模型并在每次加载视图时正确执行chartData函数？我已经尝试将所有功能保留在onBeforeRendering / onAfterRendering方法中，但这种方法也不起作用。

提前致谢

Answer 1

我假设你熟悉所提到的双向数据绑定here 和here？ “双向绑定意味着从模型到视图以及从视图到模型的绑定;模型和视图中的值更改分别更新所有相应的绑定和视图和模型“

这是你在找什么？

否则以下链接可能会有所帮助，讨论“model.refresh”：

How to refresh OData model

SAPUI5 binding issue when JSON model updated

Refresh model SAPUI5

How to refresh all (OData) bindings of a given SAPUI5 page?

如何在每次调用相应的视图时重新加载UI5控制器？

1 个答案: