angular - 在 ionic 项目中输出 XML 文件数据

Question

我使用此在线链接在我的 ionic 项目中创建了一个二维码/条码扫描器 https://www.freakyjolly.com/ionic-4-add-barcode-qr-code-scanner-encoder-ionic-4-native-plugin/

二维码工作正常并生成二维码的 XML 输出数据。下面是我正在获取的 xml。

Barcode data {"text":<?xml version=\"1.0\"encoding=\"UTF-8\"?><PrintLetterBarcodeData name="john" age="36" city="New York" country="USA">}

在教程链接中，当我尝试使用代码将数据输出到页面时

{{ scannedData["text"] }}

显示在 xml 文件中的二维码的完整细节。这是因为使用了文本关键字。但我想专门输出 XML 内容中可用的姓名、年龄或城市。请帮助我，我该怎么做。

Answer 1

由于我们正在处理 Angular ，如果我们将 xml 转换为 json 会更好，这样可以更轻松地处理数据。使用名为 ngx-xml2jsonto 的包

import { Component } from '@angular/core';
import { NgxXml2jsonService } from 'ngx-xml2json';

@Component({
 selector: 'app-root',
 templateUrl: './app.component.html',
 styleUrls: ['./app.component.css']
})

export class AppComponent {
   scannedData = `<?xml version=\"1.0\"encoding=\"UTF-8\"?><PrintLetterBarcodeData name="john" age="36" city="New York" country="USA">`;

   constructor(private ngxXml2jsonService: NgxXml2jsonService) {
    const parser = new DOMParser();
    const xml = parser.parseFromString(this.scannedData, 'text/xml');
    const obj = this.ngxXml2jsonService.xmlToJson(xml);
    console.log(obj); // will get the data as json
   }
 }