javascript - 以最优雅的方式显示弹窗

Question

我有这个 AngularJS 应用程序。一切正常。

现在我需要在特定条件为真时显示不同的弹出窗口，我想知道最好的方法是什么。

目前我正在评估两个选项，但我绝对愿意接受其他选项。

---

选项 1

我可以为弹出窗口创建新的 HTML 元素，并直接从 Controller 附加到 DOM。

这将破坏 MVC 设计模式。我对这个解决方案不满意。

---

选项 2

我总是可以在静态 HTML 文件中插入所有弹出窗口的代码。然后，使用 ngShow，我可以只隐藏/显示正确的弹出窗口。

此选项不是真正可扩展的。

---

所以我很确定必须有更好的方法来实现我想要的。

Answer 1

根据我目前使用 AngularJS 模态的经验，我认为最优雅的方法是提供一个专用服务，我们可以为该服务提供要在模态中显示的部分 (HTML) 模板。

当我们考虑它时，模态是一种 AngularJS 路由，但只是显示在模态弹出窗口中。

AngularUI 引导项目 (http://angular-ui.github.com/bootstrap/) 有一个出色的 $modal 服务(在 0.6.0 版之前曾被称为 $dialog)，它是一个显示部分内容的服务实现作为模式弹出窗口。