将xml转换为json后无法访问数据答案

【问题标题】：After converting xml to json unable to access the data将xml转换为json后无法访问数据
【发布时间】：2014-12-17 12:22:21
【问题描述】：

我正在学习 angularjs。

当我想访问 xml 文件时，我无法做到，我使用了 xml_strjson 此方法将数据 xml 转换为 json 但无法在 html 文件中访问这是我的代码：

enter code here<!DOCTYPE html>
<html ng-app="">
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js">   </script>
<script type="text/javascript" src="http://demos.amitavroy.com/learningci/assets   /js/xml2json.js" charset="UTF-8"></script>
  <script>
        function customersController($scope, $http) {
        $http.get("http://localhost:13087/Data.xml")
        .success(function (response) {
            $scope.lstComapanies = x2js.xml_str2json(response);
            console.log($scope.lstComapanies);

            alert(response);
        });
    }

</script>
     <title></title>
      </head>
   <body ng-controller="customersController">
     <table>
        <tbody>
               <tr ng-repeat="CompanyModel in lstComapanies">
                <!-- $index for duplicate values -->
                  <td class="border">
                      <label>{{ CompanyModel }}</label>
                </td>

            </tr>
        </tbody>
    </table>

我的 json 数据

{
    "__cnt": 8,
    "CompanyModel": [
        {
            "__cnt": 7,
            "BacklogSum": "646",
            "BacklogSum_asArray": [
                "646"
            ],
            "BillingSum": "607",
            "BillingSum_asArray": [
                "607"
            ],
            "BookingSum": "646",
            "BookingSum_asArray": [
                "646"
            ],
            "CashflowSum": "$-4809038.45",
            "CashflowSum_asArray": [
                "$-4809038.45"
            ],
            "LstCompanies": {
                "__cnt": 1,
                "_i:nil": "true"
            },
            "LstCompanies_asArray": [
                {
                    "__cnt": 1,
                    "_i:nil": "true"
                }
            ],
            "Name": "OPTERNA AM, INC. ",
            "Name_asArray": [
                "OPTERNA AM, INC. "
            ],
            "Number": "2000",
            "Number_asArray": [
                "2000"
            ]
        }
    ],
    "_xmlns:i": "http://www.w3.org/2001/XMLSchema-instance",

}

【问题讨论】：

尝试解析 JSON.parse(your_converted_data) 。

标签： c# xml json angularjs

【解决方案1】：

您需要为您的应用创建一个主模块，然后将控制器添加到其中。

首先，将您的脚本更改为：

var myApp = angular.module('myApp', []);

myApp.controller('customersController', ['$scope', '$http',
 function($scope, $http){
    $http.get("http://localhost:13087/Data.xml")
        .success(function (response) {
            $scope.lstComapanies = x2js.xml_str2json(response);
            console.log($scope.lstComapanies);

            alert(response);
    })
}]);

然后正确设置您的应用和控制器

<body ng-app="myApp">
    <div ng-controller="customersController">
        <table>
            .... etc

另外，如上所述，您需要更改 ng-repeat。

<tr ng-repeat="objects in lstComapanies.CompanyModel">

【讨论】：

嗨，对不起，上面显示空白页我修改了脚本，但结果没有变化，但是当我检查警报时，我可以看到数据
@user1983379，因为您将 ng-repeat 的名称更改为 objects，您是否将绑定更改为 {{objects}}
嗨，Alex Scott，我的问题已通过更改此代码得到解决 $scope.lstComapanies = obj.ArrayOfCompanyModel.CompanyModel;

【解决方案2】：

很简单：

<tr ng-repeat="CompanyModel in lstComapanies.CompanyModel">

查看您的 JSON。它以具有两个属性的对象开始： 1. ____cnt = 8（听起来像计数） 2. CompanyModel = 对象数组

所以中继器需要一个数组，而你给了他一个对象。但是这个对象包括你的数组。

JSON 表示 Java Script Obect Notation，当您在 JavaScript 中解析 JSON 时，它会以对象或数组的形式结束。因此，您可以直接访问 lstCompanies 中的所有内容（应该是 lstCampanies？）。

如果不工作，做洞的事情：

模块
控制器定义范围

使用控制器并遍历数据

angular.module('myApp', [])
 .controller('customersController', ['$scope', '$http',
  $scope.lstComapanies = {};
  function($scope, $http){
    $http.get("http://localhost:13087/Data.xml")
      .success(function (response) {
        $scope.lstComapanies = JSON.parse(x2js.xml_str2json(response));
        console.log($scope.lstComapanies);

        alert(response);
    })
}]);

<body ng-app="myApp">
  <div ng-controller="customersController">
  ...
    <tr ng-repeat="CompanyModel in lstComapanies.CompanyModel">
      <td>{{ CompanyModel.__cnt }}</td>
      <td>{{ CompanyModel.BacklogSum }}</td>
      <td>
        <span ng-repeat="sum in CompanyModel.BacklogSum_asArray">{{ sum }}</span>
      </td>
  </tr>
  ...
  </div>

注意：并非所有浏览器都存在 JSON.parse()，请参见此处：Safely turning a JSON string into an object

但通常我会将 http get 东西放在工厂或服务类中，可以将其注入到任何需要访问数据的控制器中。然后接下来我会承诺，当成功通过特定 API 函数（如 getCompanies()）返回所需数据

【讨论】：

那么你也必须添加一个 @Alex Scott 描述的角度模块。