typescript - โหลดคอมโพเนนต์แบบไดนามิกจาก JSON และแสดงผลใน HTML
ฉันมีไฟล์ JSON ที่มีคอมโพเนนต์ Angular แบบกำหนดเอง สิ่งที่ฉันต้องการทำคือสามารถดึงเนื้อหาจาก JSON นั้นและแสดงมัน
ตัวอย่าง JSON
{
"contentContainer": {
"contentList": {
"Home_Div_1": {
"refId": "Home_Div_1",
"content": "<title-component> Hi there </title-component>"
},
"Home_Div_2": {
"refId": "Home_Div_2",
"content": "<desc-component> Description section </desc-component>"
}
}
}
}
ดังนั้นหน้า HTML ควรเป็นแบบนี้
<title-component> Hi there </title-component>
<desc-component> Description section </desc-component>
[การใช้สไตล์ระดับส่วนประกอบทั้งหมด ฯลฯ]
ฉันได้ลองใช้ inner HTML กับตัวกรอง DOM แล้วซึ่งทำงานได้ดีถ้าใช้แค่แท็ก HTML แต่ไม่สามารถใช้กับคอมโพเนนต์ Angular แบบกำหนดเองได้ ปัญหาคือสตริงที่ดึงมาจาก JSON ต้องถูกแปลงและแสดงเป็นคอมโพเนนต์ Angular แบบกำหนดเองเหมือนกับว่าไม่ได้มาจาก JSON แต่เป็นโมดูลเอง ฉันได้ลองแล้ว - แต่ปัญหาคือเราจะไม่ได้รับ HTML แต่ได้รับเป็นสตริง
มือใหม่ที่นี่ การได้รับความช่วยเหลือในทิศทางที่ถูกต้องจะเป็นประโยชน์