javascript - 从 Controller Angular js显示模态

标签 javascript angularjs modal-dialog

我是 Angular JS 的新手,正在尝试使用 Angular JS 创建一个简单的模式。以下是我的模式代码

<div id="sampleModal" class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Sample Modal</h4>
        </div>
        <div class="modal-body">
            <div class="form-group">
              <h5>Name</h5>
              <input type="text" class="form-control" id="name" placeholder="Enter a name">
            </div>
            <div class="form-group">
              <div style="text-align:center;">
                <button type="submit" class="btn btn-primary btn-sm">Submit</button>
                <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">Cancel</button> 
              </div>
            </div>    
        </div>
    </div>
  </div>
</div>

单击以下按钮时将调用上述模式

<button class="btn btn-primary" type="button" id="modal" ng-click="create()">Create</button>

我的 Controller 如下

var App = angular.module('myApp', []);
App.controller('homeCtrl', ['$scope',function($scope,) {
        $scope.create = function() {

         //code to show the modal
    }
    }]);

我应该如何编写我的创建函数才能显示模式。我看过很多教程,但找不到实现该功能的方法。

谢谢。

最佳答案

查看 Angular UI Bootstrap。它具有出色的模式支持和示例来帮助您。

https://angular-ui.github.io/bootstrap/#/modal

关于javascript - 从 Controller Angular js显示模态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36287293/

相关文章:

javascript - 使用 webpack 和 babel 的动态 import() 语法错误

javascript - 无法算出简单的数学方程

angularjs - 条件 anchor 标签和点击

java - Swing 模态对话框拒绝关闭 - 有时!

javascript - 使用 iframe URL 的 jQuery UI 对话框

javascript - JQuery 提交按钮第二次不起作用

javascript - 在谷歌脚本中附加带有复选框的行

javascript - 当某些内容来自其他 JSON 对象时,如何使用 orderBy 和过滤器

javascript - 通过链式启动多个Function

javascript - Angular js - ngDialog 如何从 Controller 打开对话框?