Question

我在页面中显示一张图片表

getChartsData() {
    this.http.get('http://localhost:5555/DNZ/Produkt/Monat/by/12')
    .subscribe((res: Response) => {
      this.chartData = res.json() as chartData[];
      this.formatData(this.chartData);
      console.log("Chart Data: ", this.chartData);

    });
  }

xml中的znd

ngOnInit() {
    this.getChartsData();
    console.log("Init data:" , this.chartData);        
  }

constructor(private http: Http) {
    Object.assign(this, { chart })
    this.chartData = this.getChartsData();
  }

并且尽管在调试器中图像始终是l，但它始终会进入错误功能，但是一旦我在其他地方打开图像，图像就会完美加载

Answer 1

这会有所帮助吗？ http://jsbin.com/xusikeh/edit?html,output

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>JS Bin</title>
    <script 
            src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" 
            id="sap-ui-bootstrap" 
            data-sap-ui-theme="sap_bluecrystal" 
            data-sap-ui-xx-bindingSyntax="complex" 
            data-sap-ui-libs="sap.m"></script>
    <style type="text/css">
      .sapMObjLTitle {
        cursor: pointer;
      }
    </style>

    <!-- XML-based view definition -->
    <script id="oView" type="sapui5/xmlview">
    <mvc:View height="100%" controllerName="myView.Template"
      xmlns:core="sap.ui.core"
      xmlns:mvc="sap.ui.core.mvc"
      xmlns:m="sap.m">
      <m:Table id="imageTable">
        <m:headerToolbar>
          <m:OverflowToolbar>
            <m:Title text="some text" />
          </m:OverflowToolbar>
        </m:headerToolbar>
        <m:columns>
          <m:Column>
          </m:Column>
        </m:columns>
      </m:Table>
      </mvc:View>
    </script>

    <script>
      sap.ui.define([
        'jquery.sap.global',
        'sap/ui/core/mvc/Controller',
        'sap/ui/model/json/JSONModel',
        'sap/m/ColumnListItem',
        'sap/m/VBox',
        'sap/m/Image'
      ], function(jQuery, Controller, JSONModel, ColumnListItem, VBox, Image) {

        return Controller.extend("myView.Template", {
          onInit: function(oEvent) {
            var oView = this.getView();
            var oTable = oView.byId("imageTable");

            oTable.bindItems({
              path: "myModel>/Images",
              template: new ColumnListItem({
                vAlign: "Middle",
                cells: new sap.m.VBox({
                  items: new Image({
                    src: '{myModel>ImageLink}',
                    densityAware:false,
                    decorative: false
                  })
                })
              })
            });


            oView.setModel(new JSONModel({
              Images: [{
                ImageLink: "https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png"
              }]
            }), "myModel");
          }
        });
      });


      var oView = sap.ui.xmlview({
        viewContent: jQuery('#oView').html()
      });

      oView.placeAt('content');


    </script>

  </head>
  <body class="sapUiBody">
    <div id='content'></div>
  </body>
</html>

问题加载图像

1 个答案: