代码在jsfiddle中工作,但在html文档中不起作用。为什么?

时间:2015-07-20 19:15:37

标签: javascript jquery html sapui5

我正在尝试从xml视图创建一个sapui5表,但是当我从visual studio运行它时似乎没有工作但是当我在jsfiddle中运行它时它运行得很好。这是什么原因?

以下是我的xmlTest.hml中的代码:

<!DOCTYPE html>
<html>
<head>
    <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-libs="sap.ui.commons,sap.ui.table"></script>
    <meta charset="utf-8">
    <title>JS Bin</title>
</head>

<body class="sapUiBody" id="content">

    <script id="view1" type="ui5/xmlview">
        <core:view xmlns:core="sap.ui.core"
                   xmlns="sap.ui.commons"
                   xmlns:table="sap.ui.table"
                   xmlns:html="http://www.w3.org/1999/xhtml"
                   controllername="view.Main">
            <table:table width="100%" visiblerowcount="5" selectionmode="Single" editable="false" rows="{/data}">
                <table:title><label text="XML View"></label></table:title>
                <table:column>
                    <label text="Row Num" />
                    <table:template><textfield value="{rowNum}"></textfield></table:template>
                </table:column>
                <table:column>
                    <label text="ID" />
                    <table:template><textfield value="{id}"></textfield></table:template>
                </table:column>
                <table:column>
                    <label text="First Name" />
                    <table:template><textfield value="{name}"></textfield></table:template>
                </table:column>
                <table:column>
                    <label text="Email Address" />
                    <table:template><textfield value="{email}"></textfield></table:template>
                </table:column>

            </table:table>
        </core:view>
    </script>
    <script type="text/javascript">
        var aData = [
        { rowNum: 1, id: 42, name: "Anthony", email: "anthony@example.com" },
        { rowNum: 1, id: 42, name: "Anthony", email: "anthony@example.com" },
        { rowNum: 1, id: 42, name: "Anthony", email: "anthony@example.com" },
        ];
        sap.ui.controller("view.Main", {
            doSomething: function (oEvent) { }
        });

        var oView = sap.ui.xmlview({
            viewContent: jQuery("#view1").html()
        });
        var oModel = new sap.ui.model.json.JSONModel({
            data: aData
        });
        oView.setModel(oModel);
        oView.placeAt("content");
    </script>
</body>
</html>

从visual studio运行此代码我收到以下错误:

enter image description here

这些错误指的是this file

当我将代码复制到jsfiddle时,它的工作正常。这是我的jsfiddle

1 个答案:

答案 0 :(得分:1)

问题是你使用了小写&lt; table: t 能够&gt;而不是&lt; table: T 能够&gt;

班级名称为Table,而不是table,因此无法找到该文件(它是Table.js,而不是table.js

在你的JSFiddle中你使用了正确的套管