在 AngularJS 中將 XML 轉(zhuǎn)換為 JSON
在這篇文章中,我們將談?wù)勅绾卧贏ngular JS中將XML文件轉(zhuǎn)換為JSON。大家都知道Angular JS是開發(fā)應(yīng)用程序的JavaScript框架。所以基本上Angular JS期望得 到的響應(yīng)式JSON格式的。因此,在你開始對數(shù)據(jù)進(jìn)行操作之前,建議返回JSON格式的數(shù)據(jù)。在這篇文章中,我們會使用Angular JS $http服務(wù)加載一個本地的XML文件,并將這個XML文件轉(zhuǎn)換成JSON。如果你是Angular JS新手,請閱讀《Angular JS》。希望你會喜歡這篇文章。
背景
我曾發(fā)表過一篇有關(guān)于Angular JS $http服務(wù)的文章:《$http Service In Angular JS》
源代碼
下載源代碼: XML to JSON Source Code
使用代碼
首先創(chuàng)建一個HTML頁面。
- <!DOCTYPE html>
- <html>
- <head>
- <title>Convert XML to JSON In Angular JS - SibeeshPassion </title>
- </head>
- <body>
- </body>
- </html>
現(xiàn)在,如下添加所需的引用。
- <script src="jquery-2.1.3.min.js"></script>
- <script src="angular.min.js"></script>
- <script src="xml2json.js"></script>
你注意到了嗎,我已經(jīng)添加了xml2json.js文件?這就是將要轉(zhuǎn)換的文件。你可以從https://code
現(xiàn)在創(chuàng)建一個控制器和應(yīng)用程序指令,如下所示。
- <div ng-app="httpApp" ng-controller="httpController">
- </div>
接下來我們需要做的是添加服務(wù)。你可以按如下方式添加$http服務(wù)。
- 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是我們的應(yīng)用程序,httpController是我們的控制器。我們使用函數(shù)transformResponse轉(zhuǎn)換響應(yīng)。
轉(zhuǎn)換請求和響應(yīng)
在Angular JS中,請求可以使用transformRequest函數(shù)轉(zhuǎn)換,如果是響應(yīng)的話,可以通過函數(shù)transformResponse轉(zhuǎn)換。這些函數(shù)返回轉(zhuǎn)換后的值。
下面是我們使用transformResponse函數(shù)的一個例子。
transformResponse: function (cnv) {
var x2js = new X2JS();
var aftCnv = x2js.xml_str2json(cnv);
return aftCnv;
}
這個x2js.xml_str2json(CNV)將返回JSON對象,并從transformResponse函數(shù)返回aftCnv。聽起來不錯吧?一旦準(zhǔn)備就緒,我們只要在瀏覽器控制臺寫JSON對象,就可以看到該對象了。
輸出
在Angular JS中轉(zhuǎn)換XML為JSON,就是這么簡單。祝大家Happy coding!
結(jié)論
歡迎大家的火眼金睛。如果我有什么遺漏或?qū)戝e的地方,請不吝指正。希望大家能夠喜歡這篇文章。
譯文鏈接:http://www.codeceo.com/article/angularjs-xml-to-json.html
英文原文:Convert XML to JSON In Angular JS