在 AngularJS 的弹出窗口中包装一个表单

武士杰克

我有以下表格:

<form ng-submit="$ctrl.submit({from:$ctrl.from, to:$ctrl.to})">
    <label>From:
        <input type="text" name="input" ng-model="$ctrl.from">
    </label>
    <label>To:
        <input type="text" name="input" ng-model="$ctrl.to">
    </label>
        <input type="submit" id="submit" value="Apply" />
</form> 

我在网上寻找一种将它包装在弹出窗口中的方法,但没有找到任何关于它的信息。

现在表单一直出现在屏幕上,我想要做的是让它在单击时显示为弹出窗口。

有没有办法做到这一点?

易卜拉欣·阿尔萨迪

你可以做的是用一个 div 包裹你的表单,并根据需要将该 div 位置设置为绝对和样式,并且你可以将 a 绑定ng-show到它并从控制器控制弹出窗口的显示/隐藏。

我在这里创建了一个 plunk 检查它http://embed.plnkr.co/z3dXmI/它会给你一个想法,但你可以随意设计它。

另外,我建议使用 UI 框架/库,例如SemanticUIBootstrap

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在AngularJS中单击元素旁边的按钮弹出一个临时窗口

来自分类Dev

弹出一个临时窗口,在AngularJS中单击元素旁边的按钮

来自分类Dev

如何在 asp.net mvc 的弹出窗口中创建一个空表单?

来自分类Dev

angularjs模态对话框中的tinyMCE仅适用于第一个弹出窗口

来自分类Dev

Swift:从另一个弹出窗口中显示一个弹出窗口

来自分类Dev

Kivy:从另一个弹出窗口中关闭一个弹出窗口

来自分类Dev

在Angularjs中的mouseover上弹出一个div

来自分类Dev

AngularJS Fancybox弹出窗口

来自分类Dev

AngularJS弹出窗口

来自分类Dev

单击sharepoint中的新添加项目按钮时,如何在打开的窗口中弹出一个新的表单窗口

来自分类Dev

如何从第一个弹出窗口中打开第二个jquery-mobile弹出窗口

来自分类Dev

像fancybox一样的AngularJS Iframe弹出窗口?

来自分类Dev

像fancybox一样的AngularJS Iframe弹出窗口?

来自分类Dev

AngularJs-为什么$ emit在我的弹出窗口中不起作用

来自分类Dev

HTML文件作为AngularJS指令中Bootstrap弹出窗口中的内容

来自分类Dev

HTML文件作为AngularJS指令中Bootstrap弹出窗口中的内容

来自分类Dev

AngularJs-为什么$ emit在我的弹出窗口中不起作用

来自分类Dev

使用angularjs和bootstrap时,传递的值未显示在我的弹出窗口中

来自分类Dev

创建一个angularjs指令来包装jquery tagcanvas插件

来自分类Dev

创建一个angularjs指令来包装jquery tagcanvas插件

来自分类Dev

AngularJS指令添加一个类以在表单的Submit事件上输入表单

来自分类Dev

从Windows Phone的弹出窗口中的数据绑定列表中选择一个项目

来自分类Dev

angularjs模态窗口中的模型为空

来自分类Dev

模态窗口中的范围(AngularJS指令)

来自分类Dev

angularjs模态窗口中的模型为空

来自分类Dev

如何在弹出窗口中包装元素?

来自分类Dev

AngularJS-可以ng-show / ng-hide一个模态窗口吗?

来自分类Dev

AngularJS-监视模式窗口从另一个控制器关闭

来自分类Dev

AngularJs 应用程序无法从另一个窗口侦听 localStorage 更改

Related 相关文章

  1. 1

    在AngularJS中单击元素旁边的按钮弹出一个临时窗口

  2. 2

    弹出一个临时窗口,在AngularJS中单击元素旁边的按钮

  3. 3

    如何在 asp.net mvc 的弹出窗口中创建一个空表单?

  4. 4

    angularjs模态对话框中的tinyMCE仅适用于第一个弹出窗口

  5. 5

    Swift:从另一个弹出窗口中显示一个弹出窗口

  6. 6

    Kivy:从另一个弹出窗口中关闭一个弹出窗口

  7. 7

    在Angularjs中的mouseover上弹出一个div

  8. 8

    AngularJS Fancybox弹出窗口

  9. 9

    AngularJS弹出窗口

  10. 10

    单击sharepoint中的新添加项目按钮时,如何在打开的窗口中弹出一个新的表单窗口

  11. 11

    如何从第一个弹出窗口中打开第二个jquery-mobile弹出窗口

  12. 12

    像fancybox一样的AngularJS Iframe弹出窗口?

  13. 13

    像fancybox一样的AngularJS Iframe弹出窗口?

  14. 14

    AngularJs-为什么$ emit在我的弹出窗口中不起作用

  15. 15

    HTML文件作为AngularJS指令中Bootstrap弹出窗口中的内容

  16. 16

    HTML文件作为AngularJS指令中Bootstrap弹出窗口中的内容

  17. 17

    AngularJs-为什么$ emit在我的弹出窗口中不起作用

  18. 18

    使用angularjs和bootstrap时,传递的值未显示在我的弹出窗口中

  19. 19

    创建一个angularjs指令来包装jquery tagcanvas插件

  20. 20

    创建一个angularjs指令来包装jquery tagcanvas插件

  21. 21

    AngularJS指令添加一个类以在表单的Submit事件上输入表单

  22. 22

    从Windows Phone的弹出窗口中的数据绑定列表中选择一个项目

  23. 23

    angularjs模态窗口中的模型为空

  24. 24

    模态窗口中的范围(AngularJS指令)

  25. 25

    angularjs模态窗口中的模型为空

  26. 26

    如何在弹出窗口中包装元素?

  27. 27

    AngularJS-可以ng-show / ng-hide一个模态窗口吗?

  28. 28

    AngularJS-监视模式窗口从另一个控制器关闭

  29. 29

    AngularJs 应用程序无法从另一个窗口侦听 localStorage 更改

热门标签

归档