在Angular JS中处理模态的最简单方法是什么？

Question

问题：如何在Angular JS控制器中管理一堆模态？

我把它们放在我视图的底部并使用http://angular-ui.github.io/bootstrap/#/modal 但我最终得到了大量的html模板（有效），但感觉效率低下。

我尝试了什么：

来自UI-Bootstrap的
• $对话框（痛苦的对接）
• 使用UI-Bootstrap的模态
通过ng-include包含的模板中存储的模式
• 模态放在控制器内的视图底部＆lt;＆lt;目前正在开展工作

这感觉就像我错过了一些东西。有什么指针吗？

编辑：

我做了很多搜索并找到了一个脚本然后升级了一下：

• 您的模式是外部模板
• 他们也在您点击按钮
的范围内
• 3种不同的类型（确认，消息，加载模板）

https://github.com/clouddueling/angularjs-modals

更新

我已经回复了这个问题：http://clouddueling.github.io/angular-common/

Answer 1

正如rGil所说，使用指令，你自己而不是UI-Bootstrap，如果它似乎太复杂了。你的所有模态都会相似，或多或少。您只需要一个模板和2-3个范围变量来填充模态。然后，您可以传递参数以打开和关闭模态，并提供更多功能。你包含的越多，指令就越大。

第二个选项是使用这些模态创建单独的HTML部分，然后使用ngInclude将它们放在视图中。如果您的模态不同，但在多个页面上经常重复使用，这将节省大量时间。这方面的缺点是你仍需要打开和关闭它。 Angular的方法是编写一个指令来处理切换，如果这就是你需要的全部内容。简单的方法是编写一个小jQuery并打开点击或其他任何模式。

老实说，这一切归结为你的舒适程度。 jQuery会破坏你的代码吗？不，但它不是“Angular Way”。使用jQuery，我可以在3-4行代码中编写模式切换。这样做Angular Way是一个指令和十几行代码。但Angular方式具有将来编写标记的好处，不再需要代码。如果我只有一个模态，我可以在jQuery中完成。如果我有多个模态，就像你的情况一样，我可能会花时间学习指令，然后想出一个有效的方法。