转载

发表于 2015年11月24日
浏览 (1,081)
评论 (0)

在 AngularJS 中将 XML 转换为 JSON

在这篇文章中，我们将谈谈如何在Angular JS中将XML文件转换为JSON。大家都知道Angular JS是开发应用程序的JavaScript框架。所以基本上Angular JS期望得到的响应式JSON格式的。因此，在你开始对数据进行操作之前，建议返回JSON格式的数据。在这篇文章中，我们会使用Angular JS $http服务加载一个本地的XML文件，并将这个XML文件转换成JSON。如果你是Angular JS新手，请阅读《Angular JS》。希望你会喜欢这篇文章。

在 AngularJS 中将 XML 转换为 JSON

背景

我曾发表过一篇有关于Angular JS $http服务的文章：《 $http Service In Angular JS 》

源代码

下载源代码： XML to JSON Source Code

使用代码

首先创建一个HTML页面。

<!DOCTYPE html>
<html>
<head>
<title>Convert XML to JSON In Angular JS - SibeeshPassion </title>
</head>
<body>
</body>
</html>

现在，如下添加所需的引用。

<script src= "jquery-2.1.3.min.js" ></script>
<script src= "angular.min.js" ></script>
<script src= "xml2json.js" ></script>

你注意到了吗，我已经添加了xml2json.js文件？这就是将要转换的文件。你可以从 https://code .google.com/ p/x2js/ 下载文件。

现在创建一个控制器和应用程序指令，如下所示。

<div ng-app= "httpApp" ng-controller= "httpController" >
</div>

接下来我们需要做的是添加服务。你可以按如下方式添加$http服务。

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);
});
});

这里的httpApp是我们的应用程序，httpController是我们的控制器。我们使用函数transformResponse转换响应。

转换请求和响应

在Angular JS中，请求可以使用transformRequest函数转换，如果是响应的话，可以通过函数transformResponse转换。这些函数返回转换后的值。

下面是我们使用transformResponse函数的一个例子。

transformResponse: function (cnv) {

var x2js = new X2JS();

var aftCnv = x2js.xml_str2json(cnv);

return aftCnv;

}

这个x2js.xml_str2json（CNV）将返回JSON对象，并从transformResponse函数返回aftCnv。听起来不错吧？一旦准备就绪，我们只要在浏览器控制台写JSON对象，就可以看到该对象了。

输出

在 AngularJS 中将 XML 转换为 JSON

在Angular JS中转换XML为JSON，就是这么简单。祝大家Happy coding！

结论

欢迎大家的火眼金睛。如果我有什么遗漏或写错的地方，请不吝指正。希望大家能够喜欢这篇文章。

译文链接： http://www.codeceo.com/article/angularjs-xml-to-json.html

英文原文： Convert XML to JSON In Angular JS

正文到此结束

所属分类：编程技术

本文标签： js 响应式 src https 代码 AngularJS ip Google 开发 java 数据 XML UI json jquery HTML 下载 map App 文章 CEO http
版权声明： 本文为互联网转载文章，出处已在文章中说明(部分除外)。如果侵权，请联系本站长删除，谢谢。
本文海报： 生成海报一生成海报二

热门推荐

openfire数据库安装指南

浏览(13,742) 评论(0)
Caffe 深度学习框架上手教程

浏览(10,456) 评论(0)
ReactiveCocoa入门教程：第一部分

浏览(11,287) 评论(0)
开源HIDS-OSSEC使用实例:监测CC攻击

浏览(11,195) 评论(0)
Decorators in ES7

浏览(15,738) 评论(4)
用Electron（Atom编辑器的兄弟项目）开发桌面应用

浏览(28,762) 评论(0)
Windows下JetBrains CLion中文输出乱码的解决方法

浏览(12,215) 评论(1)
同步-@synchronized, NSLock, pthread, OSSpinLock性能比较

浏览(11,177) 评论(0)
Seaweedfs之Volume读请求重定向

浏览(25,455) 评论(3)
HTML、CSS及JavaScript ：有Promise，不会搞大肚子

浏览(13,315) 评论(0)

相关文章

阿里云首购8折

Loading...

其他链接

关于本站

本站定位：个人技术类博客

本站作用：写博客、记日志、闲聊扯淡鼓捣技术。

问题交流

[HBLOG]公众号

HBLOG

HBLOG