转载

在 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页面。

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head> 
  4.     <title>Convert XML to JSON In Angular JS - SibeeshPassion </title> 
  5. </head> 
  6. <body> 
  7. </body> 
  8. </html> 

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

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

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

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

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

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

  1. var app = angular.module( 'httpApp' , []); 
  2. app.controller( 'httpController' , function ($scope, $http) { 
  3.   $http.get( "Sitemap.xml" , 
  4.             { 
  5.     transformResponse: function (cnv) { 
  6.       var x2js =  new  X2JS(); 
  7.       var aftCnv = x2js.xml_str2json(cnv); 
  8.        return  aftCnv; 
  9.     } 
  10.   }) 
  11.     .success(function (response) { 
  12.     console.log(response); 
  13.   }); 
  14. }); 

这里的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

正文到此结束
所属分类： 编程技术

热门推荐

相关文章

阿里云首购8折
说给你听

本文目录
随机标签
书籍教程
Java入门教程 bootstrap3 CSS Apache基础教程 php springboot-demo ionic 教程 Python mysql教程 eclipse Ubuntu VPS系统配置 AngularJS 教程 Struts2教程 MongoDB教程 Redis教程 Spring教程 Git教程 Jenkins进阶系列 openfire参考指南 Java设计模式 HBase教程 Maven教程 hibernate教程 Docker 教程 memcached教程 Quartz指南 ANTLR教程 SpringCloud Hive教程 Ant教程 java实例教程 Hazelcast教程 深入浅出MyBatis Elastic-Job-Lite XStream教程 SVN教程 ibaties教程 rabittmq教程 Hadoop教程 WebService CXF学习 solr教程 JPA教程 ActiveMQ中文指南 Java内存模型 dubbo教程 Linux入门视频教程
近期评论
  1. 1 Spring Boot集成Https快速入门Demo
  2. 2 Spring Boot集成easypoi快速入门Demo
  3. 3 Spring Boot集成webflux快速入门Demo
  4. 4 Spring Boot集成Graphql快速入门Demo
  5. 5 Spring Boot API 多版本快速入门Demo
  6. 6 Spring Boot内容协商快速入门Demo
  7. 7 Spring Boot集成Debezium实现postgres增量同步
  8. 8 Spring Boot单元测试快速入门Demo
  9. 9 Spring Boot集成Spring Retry快速入门Demo
  10. 10 Spring Boot集成AJ-Captcha实现滑动验证码功能
网站信息
  • 文章总数：155,456 篇
  • 文件总数：468,734 个
  • 标签总数：2,262 个
  • 分类总数：93 个
  • 留言数量：2,538 条
  • 在线人数：625 人
  • 运行天数：4,189天
  • 最后更新：2024年04月16日19点
Loading...

其他链接

关于本站

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

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

问题交流

[HBLOG]公众号 HBLOG HBLOG