我们在Angular中编写应用程序。在我们的应用程序中，我们需要写文章，所以我们决定使用editor.JS.现在我们面临的问题是如何正确解析JSON-Article并从中生成HTML.对于文章，我们有这样的JSON对象。

<代码>{"；ID"；："；1 “ ”，“类型”："；标头"；，"；数据"；: {文本"；："；主标题"；，"；级别"；: 1}},{"；ID"；："；2 “ ”，“类型”："；段落"；，"；数据"；: {文本"；："；一些文本<；标记>；某物<；/标记>；"；}},{"；ID"；："；3 “ ”，“类型”："；列表"；，"；数据"；: {“样式”："；无序"；，"；项目"；: ["；列表项1"；，"；清单项目2"；，"；列表项目3"；]}},{"；ID"；："；4 “ ”，“类型”："；图像"；，"；数据"；: {"；文件"；: {“网址”："；www.com/test.PNG"；},"；标题"；："；"；，"；带边框"；：错误，"；拉伸的"；：错误，"；带背景"；：错误}}

简单的JSON，毫无疑问，我会在Angular Template中生成HTML，但根据我们的需要，我们可能会有更复杂的块，有许多样式选项，所以我认为在Template中处理太多逻辑，可能会减慢我们的应用程序。例如，对于图像，我们必须根据属性（如 { "id" : "1", "type" : "header", "data" : { "text" : "Main title", "level" : 1 } }, { "id" : "2", "type" : "paragraph", "data" : { "text" : "Some text <mark>something</mark>" } }, { "id" : "3", "type" : "list", "data" : { "style" : "unordered", "items" : [ "list-item 1", "list-item 2", "list-item 3" ] } }, { "id" : "4", "type" : "image", "data" : { "file" : { "url" : "www.com/test.png" }, "caption" : "", "withBorder" : false, "stretched" : false, "withBackground" : false } } 、caption、withBackground等）有条件地使用不同的类或样式。我们可能在文章和其他块中有多个图像，这些图像有许多样式选项。

另一种方法是在.ts文件中解析JSON，并将所有块映射到具有特定类和样式的HTML字符串。但是，如果我们有像图片库或滑块或其他一些复杂的块，我们将不得不生成非常大的字符串，我认为最好用单独的组件来替换，但据我所知，我们将无法使用组件选择器作为模板中的字符串。此外，我认为在.ts文件中生成HTML的情况下，我们可能会遇到样式封装的问题。

所以我的问题是，从如此复杂的JSONS中生成HTML的最佳方法是什么？如果我们把复杂的逻辑放在模板中，它真的会减慢我们的应用程序吗？也许还有第三种或第四种方法？

顺晟科技：