Javascript Typescript-按属性值显示对象

我上了这门课：

export class ToDoItem {
        id?: number
        description: string
        tags?: string[]
        deadline?: string

        constructor(description: string) {
            this.id = 0
            this.description = description
            this.tags = []
            this.deadline = ""
        }
}

我用这个脚本显示类的每个对象，并与HTML连接：

render(items: ToDoItem[]): void {

            this.clearContainer()
            for (const item of items) {
                const template = document.querySelector("#list-item-template") as HTMLTemplateElement
                const clone = template.content.cloneNode(true) as DocumentFragment
                const listItem = clone.querySelector(".list-group-item")
                const checkBox = clone.querySelector(".form-check-input")
                const description = clone.querySelector(".list-item-desc")
                const badgeContainer = clone.querySelector(".badge-container")
                const deadline = clone.querySelector(".list-item-deadline")
                const badgeTemplate = badgeContainer?.querySelector(".list-item-badge")

                checkBox?.setAttribute("data-id", item.id?.toString() || "")
                if (description) {
                    description.textContent = item.description
                }
                if (item.tags) {
                    for (const tag of item.tags) {
                        const newBadge = badgeTemplate?.cloneNode() as Element

                        newBadge.textContent = tag
                        badgeContainer?.append(newBadge)
                    }
                }
                badgeTemplate?.parentElement?.removeChild(badgeTemplate)
                if (deadline) {
                    const date = Date.parse(item.deadline || "")
                    deadline.textContent = (date) ? new Date(date).toUTCString().slice(0,16) : ""
                }
                if (listItem) {
                    this.contentEl?.append(listItem)
                }       
            }
        }

但是，由于每个对象都有一个标记列表，我想通过它们的标记来显示它们，例如：

标记1： 项目1 项目2

标记2： 项目1 项目4：

标签3： 项目3

---

项目4

您可以构建标签地图：

const项=[
{标签：“item1”，标签：[“tag1”，“tag2”]}，
{标签：“item2”，标签：[“tag2”，“tag3”]}，
{标签：“item3”，标签：[]}，
{标签：“项目4”}
];
const tagmap=新映射（）；
对于（让项目中的项目）
对于（让item.tags | |[]）的标记
if（tagmap.has（tag））
tagmap.get（tag）.push（item.label）；
其他的
tagmap.set（标记，[item.label]）；
for（让[k，v]为tagmap.entries（））
log（k+：“+v.join（））