twitter-bootstrap 单击按钮时 AngularJS 打开模态对话框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33309905/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJS open modal dialog on button click
提问by hollyquinn
I am trying to do something, that I'm guessing should be fairly easy, but I can't figure it out. All I want to do is open a modal on the click of a button. I'm following this example. http://fdietz.github.io/recipes-with-angular-js/common-user-interface-patterns/displaying-a-modal-dialog.html
我正在尝试做一些事情，我猜应该很容易，但我无法弄清楚。我想要做的就是单击按钮打开一个模式。我正在关注这个例子。 http://fdietz.github.io/recipes-with-angular-js/common-user-interface-patterns/displaying-a-modal-dialog.html
Here's my controller:
这是我的控制器：
var app = angular.module("MyApp", ["ui.bootstrap.modal"]);
app.controller('MyCtrl', function ($scope) {
$scope.open = function () {
$scope.showModal = true;
};
$scope.ok = function () {
$scope.showModal = false;
};
$scope.cancel = function () {
$scope.showModal = false;
};
});
Here's my view:
这是我的观点：
<button class="btn" ng-click="open()">Open Modal</button>
<div modal="showModal" close="cancel()">
<div class="modal-header">
<h4>Modal Dialog</h4>
</div>
<div class="modal-body">
<p>Example paragraph with some text.</p>
</div>
<div class="modal-footer">
<button class="btn btn-success" ng-click="ok()">Okay</button>
<button class="btn" ng-click="cancel()">Cancel</button>
</div>
</div>
I'm getting the error message Error: [ng:areq] Argument 'MyCtrl' is not a function, got undefined. And the modal shows on the page when it loads. Thanks in advance.
我收到错误消息 Error: [ng:areq] Argument 'MyCtrl' is not a function, got undefined。模式加载时显示在页面上。提前致谢。
采纳答案by John'
On your first line, you use "modal=" . It is a directive, you need to implement it in you code. (See here : AngularJS reusable modal bootstrap directive)
在您的第一行，您使用 "modal=" 。它是一个指令，您需要在代码中实现它。（参见此处：AngularJS 可重用模态引导指令）
For the problem " Argument 'MyCtrl' is not a function, got undefined", it is a dependency problem I think. A similar problem here : Angularjs: Error: [ng:areq] Argument 'HomeController' is not a function, got undefined
对于问题“ Argument 'MyCtrl' is not a function, got undefined”，我认为这是一个依赖问题。这里有一个类似的问题：Angularjs: Error: [ng:areq] Argument 'HomeController' is not a function, got undefined
If you want implement a modal dialogbox, I advice you to see the official Bootstrap-Angular Doc here : https://angular-ui.github.io/bootstrap/
如果你想实现一个模态对话框，我建议你在这里查看官方的 Bootstrap-Angular 文档：https: //angular-ui.github.io/bootstrap/
