如何删除元素并避免在重新插入相同ID时出现“添加具有重复ID的元素”的错误？

Question

我想删除页面的所有内容，然后单击一个按钮将不同的内容插入其中。

不幸的是，有些内容是相同的，因此具有相同的id。
我预计这不会成为问题，因为我从不尝试两次插入相同的元素。我想在重新插入之前将其删除。

但显然我发现的方法：

oPage.removeAllContent();

和

oPage.destroyContent();

实际上并没有完全删除旧内容，因为我仍然遇到错误，我试图添加一个具有重复 id 的元素：

Error: adding element with duplicate id 'text'

我怎样才能删除旧的内容，以便旧的 ID 实际上被遗忘并且我可以重新插入它们？

这是一个最小的例子（点击

Reload

按钮两次，第二次错误将出现在控制台中）： https://jsfiddle.net/1Lqc36uh/

这是最相关的（我认为）部分：

let oPage = this.byId(this.detailId);
oPage.removeAllContent();
oPage.destroyContent();
if (bSetText) {
    oPage.insertContent(new sap.m.Text(this.textId, {
        text: "SetText"
    }));
} else {
    oPage.insertContent(new sap.m.Text(this.textId, {
        text: "Test"
    }));
}

Answer 1

删除行

oPage.removeAllContent();

.

问题是您正在删除内容然后试图销毁它：

oPage.removeAllContent(); // removes the existing content (without destroying it).
oPage.destroyContent(); // tries to destroy but there is no content!

ManagedObject 方法

destroyXYZ()

依赖于子控件首先作为聚合的一部分存在的事实。
通过

removeAllXYZ()

删除控件确实将它们从 UI 中删除并使它们不再与父级相关，但它们没有被破坏并且仍在控件注册表中。因此，“重复 ID”错误。

方法

destroyContent()

足以从控件注册表中删除UI中的内容和。

Answer 2

你真的需要给每个元素一个ID吗？在 UI5 中，大多数事情都可以在没有 ID 的情况下完成。通常

JSONModel

是控制 UI 元素的更好方法。

例如，您可以使第一个元素可见而第二个元素不可见（即使在 JSONModel 中使用相同的属性，因此两个元素都会自动切换）。

话虽如此，您可以自行销毁移除的元素。

oPage
    .removeAllContent()
    .forEach(oControl => { oControl.destroy(); });

---

编辑：你可以不接受这个答案，好像@Boghyon 给了一个更好的答案。