将 JSON 解析为 HTML 表答案

【问题标题】：Parsing JSON into HTML Table将 JSON 解析为 HTML 表
【发布时间】：2016-10-01 11:09:41
【问题描述】：

谁能帮我用 BLOB 解析 Oracle DB 中的 XML 内容。并使用 Angular JS 在带有 HTML 表格的 UI 中显示它。

每当我查询一个字段时，它都会从 Oracle DB 中返回多个带有 BLOB 的 ROW

每个 Blob 都包含 XML 数据。现在我想从 AngularJS 中解析它。

这里我试过了

我从 php 获取 XML 响应并将其发送到 Sitemap.xml 并在 AngularJS 中访问它

由于我有 3 ROWS 从数据库返回，我得到 3 个 XML 标签，如下所示

<Person:PersonEvent xmlns:Person = "http://PERSON/PersonEvent">
    <Person:Body>
        <Person:WorkOrder workOrderId = "1">
            <Person:OrderStatus>RED</Person:OrderStatus>
            <Person:OrderType>A</Person:OrderType>
        </Person:WorkOrder>
    </Person:Body>
</Person:PersonEvent>
<Person:PersonEvent xmlns:Person = "http://PERSON/PersonEvent">
    <Person:Body>
        <Person:WorkOrder workOrderId = "2">
            <Person:OrderStatus>GREEN</Person:OrderStatus>
            <Person:OrderType>B</Person:OrderType>
        </Person:WorkOrder>
    </Person:Body>
</Person:PersonEvent>
<Person:PersonEvent xmlns:Person = "http://PERSON/PersonEvent">
    <Person:Body>
        <Person:WorkOrder workOrderId = "3">
            <Person:OrderStatus>RED</Person:OrderStatus>
            <Person:OrderType>C</Person:OrderType>
        </Person:WorkOrder>
    </Person:Body>
</Person:PersonEvent>

现在我想使用 ANGULAR JS 将其转换为 JSON 并在 HTML TABLE 中显示值。你能帮帮我吗

AngularJS

    var app = angular.module('httpApp', []);
    app.controller('httpController', function ($scope, $http) {
        $http.get("Sitemap.xml",
                {
                    transformResponse: function (cnv) {
                        var x2js = new X2JS();
                        var aftCnv = x2js.xml_str2json(cnv);
                        return aftCnv;
                    }
                })
        .success(function (response) {
            console.log(response);
        });
    });

我的 UI 应该看起来像 HTML 表格

   <table>
  <tr>
    <th>WorkOrder</th>
    <th>OrderStatus</th>
    <th>OrderType</th>
  </tr>
  <tr>
    <td>1<br></td>
    <td>RED</td>
    <td>A</td>
  </tr>
  <tr>
    <td>2</td>
    <td>GREEN</td>
    <td>B</td>
  </tr>
  <tr>
    <td>3</td>
    <td>RED</td>
    <td>C</td>
  </tr>
</table>

【问题讨论】：

您拥有 XML 并且想要生成 HTML。 JSON与什么有什么关系？
请不要标记垃圾邮件。虽然您的 XML 来自 BLOB 并且您正在使用 PHP 服务器端来检索它，但这个问题与 blob 或 PHP 没有任何关系。这是一个关于使用 Angular 在 XML 上运行的客户端 JavaScript 的问题。我删除了不相关的标签并添加了javascript。我没有删除 json 等待您澄清 JSON 与此有什么关系。
@T.J.Crowder 由于我的 XML 数据非常大，我在这里给出了示例，所以我希望它在解析之前拥有 JSON，并且在 Angular JS 中解析 JSON 也很容易
帮助什么？您尚未确定显示的代码中存在什么问题
目前我得到 3 个 XML 标签，现在我需要转换为 JSON 和 Parse 所以我需要 Angular JS 方法的帮助

标签： javascript angularjs json xml

【解决方案1】：

我得到了自己的答案。问题是 XML 有多个根元素，因此它没有转换为 JSON。

作为一种解决方法，现在我正在附加我的 XML，所以现在我可以将它转换为 JSON

<Persons>
<Person:PersonEvent xmlns:Person = "http://PERSON/PersonEvent">
    <Person:Body>
        <Person:WorkOrder workOrderId = "1">
            <Person:OrderStatus>RED</Person:OrderStatus>
            <Person:OrderType>A</Person:OrderType>
        </Person:WorkOrder>
    </Person:Body>
</Person:PersonEvent>
<Person:PersonEvent xmlns:Person = "http://PERSON/PersonEvent">
    <Person:Body>
        <Person:WorkOrder workOrderId = "2">
            <Person:OrderStatus>GREEN</Person:OrderStatus>
            <Person:OrderType>B</Person:OrderType>
        </Person:WorkOrder>
    </Person:Body>
</Person:PersonEvent>
<Person:PersonEvent xmlns:Person = "http://PERSON/PersonEvent">
    <Person:Body>
        <Person:WorkOrder workOrderId = "3">
            <Person:OrderStatus>RED</Person:OrderStatus>
            <Person:OrderType>C</Person:OrderType>
        </Person:WorkOrder>
    </Person:Body>
</Person:PersonEvent>
</Persons>

【讨论】：