How to parse xml in Angular 2
Based on the library http://goessner.net/download/prj/jsonxml/, I implemented a sample to receive XML data and parse them into an Angular2 application:
var headers = new Headers();(...)headers.append('Accept', 'application/xml');return this.http.get('https://angular2.apispark.net/v1/companies/', { headers: headers}).map(res => JSON.parse(xml2json(res.text(),' ')));
To be able to use the library, you need to parse first the XML string:
var parseXml;if (typeof window.DOMParser != "undefined") { parseXml = function(xmlStr) { return ( new window.DOMParser() ).parseFromString(xmlStr, "text/xml"); };} else if (typeof window.ActiveXObject != "undefined" && new window.ActiveXObject("Microsoft.XMLDOM")) { parseXml = function(xmlStr) { var xmlDoc = new window.ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async = "false"; xmlDoc.loadXML(xmlStr); return xmlDoc; };} else { throw new Error("No XML parser found");}
See this question:
See this plunkr: https://plnkr.co/edit/dj63ASQAgrNcLLlwyAum?p=preview.
I would rather go with npm module instead of Javascript because
- This is TypeScript & not JavaScript
- while serving this would work, but while making a build or distribution it wont work as it will give error xml2json is not defined as it is available only in javascript & Not in TS or at the time of transpilation.(happened in my case)
I did something like this.
var parser = new xml2js.Parser({explicitArray : false});//used xml2js parser from npm (https://www.npmjs.com/package/xml2js)//and in my service i used this this.http.get(this.newsURL) .flatMap(res=>{ return Observable.fromPromise(this.getJSON(res.text())) }) .catch((error:any) => Observable.throw(error.json().error || 'Server error'));
This is if you are using doing a POST and getting back XML response:Use xml2js - https://www.npmjs.com/package/xml2js
- npm install xml2js -g
import in service file as : import * as xml2js from 'xml2js';
Code:
let formdata = new URLSearchParams();formdata.set('username','username');formdata.set('pw','pw');let headers = new Headers({'Content-Type': 'application/x-www-form-urlencoded' });let options = new RequestOptions({ headers: headers, method: RequestMethod.Post}); postCaseFile () { this.http.post(this._apiUrl, formdata.toString(), options) //convert to JSON here .map(res => { xml2js.parseString( res.text(), function (err, result) { console.dir(result); // Prints JSON object! }); }).subscribe(data => { console.log(data); });}