Jquery ui 可重用的JQuery UI对话框在AngularJS中不起作用

我试图从AngularJS部分HTML页面使用jQueryUI对话框

问题是，该对话框工作正常，甚至可以从一个视图中打开多种类型的对话框，只要该视图是第一次打开

然而，当导航到另一个视图，然后使用该对话框返回到该视图时，尝试打开该对话框的工作方式就好像要显示两个对话框，而不是一个。浏览器“刷新”视图URL使问题消失，直到下一次来回导航

我放置了一个测试应用程序（未与真正的后端集成）来说明问题：

导航到：

点击红色的“获取建议”按钮：对话框显示OK，可以用Esc关闭

现在，请导航到，然后返回到

单击红色“获取建议”。你会看到两个对话框，一个在另一个上面-我所说的小车行为

相关指令代码：

.directive('advice', [function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var self = $(element),
                adviceDialog = $(attrs.advice);

            adviceDialog.dialog({
                width: 260,
                height: 405,
                autoOpen: false,
                modal: true,
                dialogClass: "advice_dialog"
            });

            self.click(function () {
                adviceDialog.dialog('open');
            });

            adviceDialog.find('button').click(function() {
                adviceDialog.dialog('close');
            });
        }
    }
}])

检查

 adviceDialog.is('dialog'))

似乎不起作用——总是这样

我正在寻找修复（而不是基础设施替换）

任何暗示都将不胜感激

---

Max.

这是对该指令的修改，由开发人员wokring在项目中发现，似乎解决了问题：

.directive('advice', [function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var self = $(element),
                adviceDialog = $(attrs.advice);

            self.click(function () {
                adviceDialog.dialog({
                    width: 260,
                    height: 405,
                    autoOpen: false,
                    modal: true,
                    dialogClass: "advice_dialog",
                    close: function() {
                        adviceDialog.dialog('destroy');
                    }
                });

                adviceDialog.dialog('open');
            });

            adviceDialog.find('button').click(function() {
                adviceDialog.dialog('close');
            });
        }
    }
}])

注意：原始问题中提到的URl可能无法运行-对此表示抱歉

---

最大值

当我记录

$（'.advice_dialog'）时，页面中有2个。长度

。最好是以ID为目标，还可以检查对话框元素是否有数据。每个ui小部件都将数据存储在主选择器上，或者另一个想法是创建一个对话框服务。值得注意的是，这里的关键部分是更改此adviceDialog.dialog（“关闭”）；此adviceDialog.dialog（'destroy'）；