How to parse xml in Angular 2 How to parse xml in Angular 2 xml xml

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

  1. This is TypeScript & not JavaScript
  2. 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

  1. npm install xml2js -g
  2. import in service file as : import * as xml2js from 'xml2js';

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