如何解析XML在2角 [英] How to parse xml in Angular 2

问题描述

我使用的是使用XML而不是JSON的API。如何以下XML转换成JSON任何建议或如何正确地在ngFor指令中使用的数据？

此外，也可观察到的是合适的吗？

 ＆LT;病例文件＆gt;
  ＆LT;序列号＆GT; 123456789＆LT; /序列号＆GT;
    ＆LT;交易日期和GT; 20150101＆LT; /交易的日期与GT;
      ＆LT;案件档案的头＆GT;
       ＆LT;申请日＆GT; 20140101＆LT; /申请日＆GT;
      ＆LT; /箱文件头＆GT;
 // ...
   ＆LT;＆分类GT;
  ＆LT;分类＆GT;
   ＆LT; international- code-总-NO→1＆LT; / international- code-总-NO＆GT;
   ＆LT;主体 -  code取代; 025＆LT; /主体 -  code＆GT;
  ＆LT; /分类＆GT;
 ＆LT; /分类＆GT;
 ＆LT; /区分文件＆gt;
 ＆LT;病例文件＆gt;
     ＆LT;序列号＆GT; 234567890＆LT; /序列号＆GT;
    ＆LT;交易日期和GT; 20160401＆LT; /交易的日期与GT;
      ＆LT;案件档案的头＆GT;
       ＆LT;申请日＆GT; 20160401＆LT; /申请日＆GT;
      ＆LT; /箱文件头＆GT;
// ...
   ＆LT;＆分类GT;
  ＆LT;分类＆GT;
   ＆LT; international- code-总-NO→1＆LT; / international- code-总-NO＆GT;
   ＆LT;主体 -  code取代; 042＆LT; /主体 -  code＆GT;
  ＆LT; /分类＆GT;
 ＆LT; /分类＆GT;
＆LT; /区分文件＆gt;
 

---

 出口类apiService {
   构造函数（私人HTTP：HTTP）{}   私人_apiUrl ='应用程序/ API';   getCaseFile（）{
     返回this.http.get（this._apiUrl）
//转换到这里JSON？
                    .MAP（RES =＆GT;＆LT; CaseFile []方式＆gt; res.json（）数据）
                     .catch（this.handleError）;
   }
    私人的HandleError（错误：响应）{     console.error（错误）;
    返回Observable.throw（error.json（）错误||'服务器错误）;
   }
 }＆LT; D​​IV * ngFor =＃案卷的CF＆GT; {{案例file.serial数}}＆LT; / DIV＆GT;
 

解决方案

根据图书馆的http：/ /goessner.net/download/prj/jsonxml/ ，我实现了一个样本接收XML数据，并分析它们到Angular2应用程序：

  VAR标题=新的报头（）;
（......）
headers.append（接受，应用程序/ XML'）;返回this.http.get（'https://angular2.apispark.net/v1/companies/'，{
  标题：标题
}）地图（RES =＆GT; JSON.parse（xml2json（res.text（），''）））;
 

要能够使用图书馆，你需要先来解析XML字符串：

  VAR parseXml;如果（typeof运算window.DOMParser！=未定义）{
  parseXml =功能（xmlStr）{
    回报（新window.DOMParser（））.parseFromString（xmlStr，文/ XML）;
  };
}否则如果（typeof运算window.ActiveXObject =未定义＆放大器;！＆安培;
   新window.ActiveXObject（Microsoft.XMLDOM））{
    parseXml =功能（xmlStr）{
      VAR xmlDoc中=新window.ActiveXObject（Microsoft.XMLDOM）;
      xmlDoc.async =假;
      xmlDoc.loadXML（xmlStr）;
      返回xmlDoc中;
  };
}其他{
  抛出新的错误（没有找到XML解析器）;
}
 

看到这个问题：

• 解析XML使用JavaScript

看到这个plunkr： https://plnkr.co/edit/dj63ASQAgrNcLLlwyAum?p = preVIEW 。

I'm using an API that uses XML instead of JSON. Any suggestions on how to convert the following XML to JSON or how to properly use the data in an ngFor directive?

Also, would an observable be appropriate here?

<case-file>
  <serial-number>123456789</serial-number>
    <transaction-date>20150101</transaction-date>
      <case-file-header>
       <filing-date>20140101</filing-date>
      </case-file-header>
 // ...
   <classifications>
  <classification>
   <international-code-total-no>1</international-code-total-no>
   <primary-code>025</primary-code>
  </classification>
 </classifications>
 </case-file>
 <case-file>
     <serial-number>234567890</serial-number>
    <transaction-date>20160401</transaction-date>
      <case-file-header>
       <filing-date>20160401</filing-date>
      </case-file-header>
//...
   <classifications>
  <classification>
   <international-code-total-no>1</international-code-total-no>
   <primary-code>042</primary-code>
  </classification>
 </classifications>
</case-file>

---

export class apiService {
   constructor (private http: Http) {}

   private _apiUrl = 'app/api';  

   getCaseFile () {
     return this.http.get(this._apiUrl)
//conversion to JSON here?
                    .map(res => <CaseFile[]> res.json().data)
                     .catch(this.handleError);
   }
    private handleError (error: Response) {

     console.error(error);
    return Observable.throw(error.json().error || 'Server error');
   }
 }

<div *ngFor="#cf of case-file">{{case-file.serial-number}}</div>

解决方案

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:

• Parse XML using JavaScript

See this plunkr: https://plnkr.co/edit/dj63ASQAgrNcLLlwyAum?p=preview.

这篇关于如何解析XML在2角的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！