本文介绍了以最优雅的方式显示弹出窗口的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I have this AngularJS app. Everything works just fine.

现在我需要在特定条件成立时显示不同的弹出窗口,我想知道最好的方法是什么.

Now I need to show different pop-ups when specific conditions become true, and I was wondering what would be the best way to proceed.

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

Currently I’m evaluating two options, but I’m absolutely open to other options.

我可以为弹出窗口创建新的 HTML 元素,并直接从控制器附加到 DOM.

I could create the new HTML element for the pop-up, and append to the DOM directly from the controller.

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

This will break the MVC design pattern. I’m not happy with this solution.

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

I could always insert the code for all the pop-ups in the static HTML file. Then, using ngShow, I can hide / show only the correct pop-up.

这个选项并不是真正可扩展的.

This option is not really scalable.

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

So I’m pretty sure there has to be a better way to achieve what I want.

推荐答案

根据我目前在 AngularJS modals 方面的经验,我认为最优雅的方法是提供一个专门的服务,我们可以为它提供一个部分 (HTML) 模板以模态显示.

Based on my experience with AngularJS modals so far I believe that the most elegant approach is a dedicated service to which we can provide a partial (HTML) template to be displayed in a modal.

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

When we think about it modals are kind of AngularJS routes but just displayed in modal popup.

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

The AngularUI bootstrap project (http://angular-ui.github.com/bootstrap/) has an excellent $modal service (used to be called $dialog prior to version 0.6.0) that is an implementation of a service to display partial's content as a modal popup.

这篇关于以最优雅的方式显示弹出窗口的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-20 18:07