title: How to parse xml in Angular 2
body: <p>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?</p>
  
  <p>Also, would an observable be appropriate here?</p>
  
  <pre><code>&lt;case-file&gt;
    &lt;serial-number&gt;123456789&lt;/serial-number&gt;
      &lt;transaction-date&gt;20150101&lt;/transaction-date&gt;
        &lt;case-file-header&gt;
         &lt;filing-date&gt;20140101&lt;/filing-date&gt;
        &lt;/case-file-header&gt;
   // ...
     &lt;classifications&gt;
    &lt;classification&gt;
     &lt;international-code-total-no&gt;1&lt;/international-code-total-no&gt;
     &lt;primary-code&gt;025&lt;/primary-code&gt;
    &lt;/classification&gt;
   &lt;/classifications&gt;
   &lt;/case-file&gt;
   &lt;case-file&gt;
       &lt;serial-number&gt;234567890&lt;/serial-number&gt;
      &lt;transaction-date&gt;20160401&lt;/transaction-date&gt;
        &lt;case-file-header&gt;
         &lt;filing-date&gt;20160401&lt;/filing-date&gt;
        &lt;/case-file-header&gt;
  //...
     &lt;classifications&gt;
    &lt;classification&gt;
     &lt;international-code-total-no&gt;1&lt;/international-code-total-no&gt;
     &lt;primary-code&gt;042&lt;/primary-code&gt;
    &lt;/classification&gt;
   &lt;/classifications&gt;
  &lt;/case-file&gt;
  </code></pre>
  
  <hr>
  
  <pre><code>export class apiService {
     constructor (private http: Http) {}
  
     private _apiUrl = 'app/api';  
  
     getCaseFile () {
       return this.http.get(this._apiUrl)
  //conversion to JSON here?
                      .map(res =&gt; &lt;CaseFile[]&gt; res.json().data)
                       .catch(this.handleError);
     }
      private handleError (error: Response) {
  
       console.error(error);
      return Observable.throw(error.json().error || 'Server error');
     }
   }
  
  &lt;div *ngFor="#cf of case-file"&gt;{{case-file.serial-number}}&lt;/div&gt;
  </code></pre>