Angular 从.json/.xml中读取数据，并在列表中填充数据

作为我学习课程的一部分，我正在Angular中设置一个CRUD应用程序，并使用wand从一个文件（可以接受.json/.xml格式）填充我的列表。我已经设法从文件中读取并在控制台中打印，但我不知道如何与我的模板和服务通信，这些模板和服务最终将处理并打印出我想要的输出

到目前为止，我一直遵循这个指南。这是代码的最终存储库：。我跳过了动画部分，因为我现在不想学习它。（现在我有一个从内存中web api读取的服务，该服务帮助我请求http创建/读取/更新/删除功能）

在product.component.html中，我的输入类型接受json和xml：

<div>
    Select file:
    <input type="file" accept='.json,.xml' (change)="changeListener($event)">
</div> 

---

我不知道如何与产品服务/模板沟通我的信息，以及在读取文件时如何处理json格式和xml格式之间的差异。

您可以按文件类型检查
这里您已经声明了

var文件：file=inputValue.files[0]
在这些
文件
变量中，您可以获得所有文件信息，您只需在此处进行检查

    if(file && file.type === 'text/xml'){

    }else if(file && file.type === 'application/json'){

    }else{
        return;
    }

您可以按文件类型进行检查

这里您已经声明了
var文件：file=inputValue.files[0]
在这些
文件
变量中，您可以获得所有文件信息，您只需在此处进行检查

    if(file && file.type === 'text/xml'){

    }else if(file && file.type === 'application/json'){

    }else{
        return;
    }