将 XML 转换为 Json Angular

Question

I am consuming an api that returns XML and am having trouble converting it to json, im trying to use the xml2js but i keep getting undefined in the console

here is my api service

export class WordgameService {
public apiUrl ="http://www.wordgamedictionary.com/api/v1/references/scrabble/";
public apiKey ="********************\";



 constructor(private http: HttpClient) {

  }

getSearchTerm(inputValue: string){

  var xmlString = this.http.get(this.cors+this.apiUrl + inputValue+this.apiKey,{ responseType: 'text' , headers:{'Content-Type': 'application/xml'}}).subscribe(response => {
  console.log(response);
});
  var json = this.convertToJson(xmlString)
console.log(json)
    return json;

console.log(json)
}
convertToJson(xml:any){
var json =xml2js.parseString(xml,function(err,result){
})

}
 

    
   

and the component

export class WordCheckerComponent implements OnInit {
  searchword = new FormControl('');
  private results :any;
  constructor(private apiService: WordgameService) {

   }
  searchWord() {

  this.results = this.apiService.getSearchTerm(this.searchword.value);

  }
  ngOnInit(): void {


  }
}

Also here is the response for the word "test"

<entry>
    <word>test</word>
    <scrabble>1</scrabble>
    <scrabblescore>4</scrabblescore>
    <sowpods>1</sowpods>
    <sowpodsscore>4</sowpodsscore>
    <wwf>1</wwf>
    <wwfscore>4</wwfscore>
</entry>

enter image description here

Answer 1

You can use xml-js to convert your XML response to JSON. I found this to be simple and better than xml2js . Also, make sure your console logging the JSON after the declaration and fetching from the correct API path.

This will be your XML response using xml-js

    var XMLResponse= this.http.get(this.cors+this.apiUrl + inputValue+this.apiKey,{ responseType: 'text' , headers:{'Content-Type': 'application/xml'}}).subscribe(response => {
  console.log(response);
});

and this will be your JSON converted Response

var JSONResponse = JSON.parse(
      convert.xml2json(XMLResponse, {
        compact: true,
        trim: true,
      })
    );

console.log(JSONResponse)