6

问题:如何在 Angular JS 控制器中管理一堆模式?

我将它们放在视图的底部并使用http://angular-ui.github.io/bootstrap/#/modal 但我最终得到了大型 html 模板(可行)但感觉效率低下。

我试过的:

  • 来自 UI-Bootstrap 的 $dialog(屁股疼)
  • 模态存储在模板中,通过 ng-include 使用 UI-Bootstrap 的模态
  • 模态框放在控制器中我视图的底部<<当前打开并且正在工作

这感觉就像我错过了什么。任何指针?

编辑:

我做了很多搜索并找到了一个脚本,然后对其进行了一些升级:

  • 您的模态是外部模板
  • 它们也在您单击按钮的范围内
  • 3 种不同类型(确认、消息、加载模板)

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

更新

从那以后我做了一个关于这个问题的回购: http: //clouddueling.github.io/angular-common/

4

1 回答 1

8

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

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

老实说,这一切都取决于您的舒适度。jQuery 会破坏你的代码吗?不,但这不是“角度方式”。使用 jQuery,我可以用 3-4 行代码编写一个模态切换。使用 Angular 方式执行此操作是一个指令和十几行代码。但是 Angular 方式的好处是以后可以写标签,不需要更多的代码。如果我只有一个模态,我可以用 jQuery 来做。如果我有多个模态,就像你的情况一样,我可能会花时间学习指令并想出一个可以按照我希望的方式工作的指令。

于 2013-05-24T07:35:54.293 回答