javascript AngularJS UI-Bootstrap 模态
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24448305/
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 UI-Bootstrap Modal
提问by alexvanzyl
Below is my angular code I am not getting any errors, the model opens up but the ModalInstanceCtrl functions cancel() and ok() do not want to work, however If I right out the controller exactly like they have it on angularjs ui-bootstrap (http://angular-ui.github.io/bootstrap/#/modal) directives website it seems to work.
下面是我的 angular 代码，我没有收到任何错误，模型打开了，但是 ModalInstanceCtrl 函数 cancel() 和 ok() 不想工作，但是如果我把控制器完全像他们在 angularjs ui-bootstrap 上一样( http://angular-ui.github.io/bootstrap/#/modal) 指令网站它似乎工作。
I am using the same HTML as in the example on the website except I have extracted the inline template to its own file, which is working.
我使用的 HTML 与网站上的示例相同，只是我已将内联模板提取到其自己的文件中，该文件正在运行。
Package versions: Bootstrap 3.1.1, AngularJS 1.2.18, UI Bootstrap 0.11.0
软件包版本：Bootstrap 3.1.1、AngularJS 1.2.18、UI Bootstrap 0.11.0
I think the issue is here where I include the controller maybe I am not doing it correctly
我认为问题出在我包含控制器的地方，也许我没有正确做
controller: this.ModalInstanceCtrl,
Main App app.js:
主应用程序 app.js：
'use strict'
angular.module('myApp', ['ui.bootstrap', myAppControllers]);
Controllers controllers.js:
控制器controllers.js：
'use strict';
var myApp = angular.module('myAppControllers', []);
myApp.controller('ModalCtrl', ['$scope', '$modal', '$log', function($scope, $modal, $log) {
$scope.open = function (size) {
var modalInstance = $modal.open({
templateUrl: 'templates/myModalContent.html',
controller: this.ModalInstanceCtrl,
size: size,
}
});
modalInstance.result.then(function (selectedItem) {
$scope.selected = selectedItem;
}, function () {
$log.info('Modal dismissed at: ' + new Date());
});
};
}]);
myApp.controller('ModalInstanceCtrl', ['$scope', '$modalInstance', function($scope, $modalInstance) {
$scope.ok = function () {
$modalInstance.close();
};
$scope.cancel = function () {
$modalInstance.dismiss();
};
}]);
回答by alexvanzyl
Ok found a solution here:
好的，在这里找到了解决方案：
Calling another controller within AngularJS UI Bootstrap Modal
在 AngularJS UI Bootstrap Modal 中调用另一个控制器
problem is the called controller must be wrapped in single quotes:
问题是被调用的控制器必须用单引号括起来：
controller: 'ModalInstanceCtrl',
credit to Chris Southam
归功于克里斯·索瑟姆
