Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular: Convert XML to JSON

Tags:

angular

I have this method where I receive an XML response from a remote server and I need to convert the XML to JSON so that Angular 2 can work with the data:

 private extractData(res: Response) {
    let xml = res["_body"]
    console.log(xml);
    var parser = require('xml2json');
    var json = parser.toJson(xml);
    return json
  }

I am trying to use this Node Module: https://www.npmjs.com/package/xml2json

Now this node module is written in javascript (NOT TypeScript) so I'm not sure if I can even use it in an Angular 2 app.

I am getting this compilation error:

ERROR in ./~/isemail/lib/index.js Module not found: Error: Can't resolve 'dns' in '/Users/user/ebayTool/node_modules/isemail/lib' @ ./~/isemail/lib/index.js 5:12-26 @ ./~/joi/lib/string.js @ ./~/joi/lib/index.js @ ./~/xml2json/lib/xml2json.js @ ./~/xml2json/lib/index.js @ ./~/xml2json/index.js @ ./src/app/hero.service.ts @ ./src/app/app.component.ts @ ./src/app/app.module.ts @ ./src/main.ts @ multi webpack-dev-server/client?http://localhost:4200/ ./src/main.ts webpack: Failed to compile.

So my question is how to convert XML to JSON in Angular 2 and how I can properly import xml2json Node Module to be used in my project?

like image 314
etayluz Avatar asked Feb 15 '17 11:02

etayluz


People also ask

Can I convert XML to JSON?

To convert an XML document to JSON, follow these steps: Select the XML to JSON action from the Tools > JSON Tools menu. Choose or enter the Input URL of the XML document. Choose the path of the Output file that will contain the resulting JSON document.

Can we use XML in angular?

AngularJS (Angular) is a structural framework for dynamic Web apps. With Angular, the CData API Server, and the ADO.NET Provider for XML (or any of 200+ other ADO.NET Providers), you can build single-page applications (SPAs) with access to live data from XML.

Why JSON is better than XML?

JSON is faster because it is designed specifically for data interchange. JSON encoding is terse, which requires less bytes for transit. JSON parsers are less complex, which requires less processing time and memory overhead. XML is slower, because it is designed for a lot more than just data interchange.

How do I display XML in angular 8?

After creating the project, open the project in your favorite editor and install the "timers" npm package. This package is necessary for reading an XML file with xml2js package. Open the index. html present at root folder and add a reference for Bootstrap and jQuery.


2 Answers

If you use angular-cli to bootstrap your application - it comes already with node module to convert xml.

https://github.com/Leonidas-from-XIV/node-xml2js

So you do not need to add extra modules for this. As it is classic commonJS module - you need use require to import it:

let parseString = require('xml2js').parseString;

So your code can looks like:

let parseString = require('xml2js').parseString;
let xml = "<root>Hello xml2js!</root>"

parseString(xml, function (err, result) {
  console.dir(result);
});

You will receive next output:

enter image description here

In any cases - if you even do not use angular-clior want to use your preffered module to parse xml - use require to load it.

like image 163
VadimB Avatar answered Oct 09 '22 22:10

VadimB


function parseXml(xmlStr) {
    var result;
    var parser = require('xml2js');
    parser.Parser().parseString(xmlStr, (e, r) => {result = r});
    return result;
}
like image 34
Pankaj kumar Avatar answered Oct 09 '22 22:10

Pankaj kumar