Tagit 在我们的 Angular JS 应用程序中表现异常

Question

我们在 Angular JS 应用程序中使用 JQuery Tagit 库。这需要一些技巧，例如手动调用 $scope.$apply() 以确保 Tagit 小部件 UI 在特定时间更新。但是，我们遇到了一个我们没有专业知识来解决的问题。我们在一个页面上有两个 Tagit 框，其中一个出现在模式弹出窗口中（尽管仍在同一页面上）。这是这两个 Tagit 元素的 HTML 代码：

<ul id="mailShareTags" tag-it>   <!-- for the main page -->
<ul id="mailIdTags" tag-it>      <!-- for the modal -->

它们共享相同的指令，但 ID 不同。

问题：

我们观察到的是，如果用户从模态中的 Tagit 中删除条目，这些条目实际上会从 both 基础模型中删除。换句话说，如果我们通过以下代码检查当前分配的标签，我们会观察到从一个 Tagit 中删除标签会从 both 模型中删除它：

// removing from the modal also removes it here
$scope.currentIds = $("#mailShareTags").tagit("assignedTags");

问题还在继续。当我们的 JavaScript 代码通过以下方式在主 Tagit 上进行清理时：

tagit("removeTagByLabel", some_id);

在模式中删除的标签仍然出现在 UI 中。似乎即使这些标签已从模式中删除，也从未发生过让 UI 知道这些标签已删除的摘要（理想情况下，我们甚至不希望首先删除这些标签）。

我非常乐意提供您可能需要的任何信息。欢迎任何和所有见解。

Answer 1

信不信由你，我们试了一些东西，结果碰巧解决了问题，或者至少解决了 UI 中可见的错误。而不是使用：

$("#mailShareTags").tagit("removeTagByLabel", some_id);

对于小部件中的每个标签，我们只调用了一次：

$("#mailShareTags").tagit("removeAll");

这从 Tagit 中删除了所有元素，并在我们的例子中清理了 UI。

如果有人在删除所有标签时将 Tagit 模型与 UI 显示的内容同步时遇到问题，请考虑使用 tagit("remoteAll") 而不是单独删除标签。