我正在使用Angular 1.4.1和UI Bootstrap 0.13.
我有一个指令,我正在打开一个模态.模态打开很好,但按钮似乎没有绑定到他们的处理程序 – 他们什么都不做.我在另一个项目中使用了相同的代码就好了,除了不在指令中.
我的指示:
(function () { var app = angular.module('myApp'); app.directive('someDirective',function () { return { restrict: 'E',templateUrl: 'SomeDirective.html',scope: { list1: '=list1',list2: '=list2',save: '&' },controller: ['$scope','$modal','myService',function ($scope,$modal,myService) { $scope.openModal = function () { var modalInstance = $modal.open({ templateUrl: 'ModalTemplate.html',controller: 'modalController',backdrop: 'static',size: 'sm',resolve: { saveData: function () { //do save action } } }); modalInstance.result.then( function (itemToSave) { //save item },function () { //Cancel } ); }; }] } }); }());
模态的控制器:
(function() { var app = angular.module('myApp'); app.controller('modalController',[ '$scope','$modalInstance','saveData',function($scope,$modalInstance,saveData) { $scope.saveData = saveData; $scope.save = function() { $modalInstance.close($scope.saveData); }; $scope.cancel = function() { $modalInstance.dismiss('cancel'); }; } ]); }());
模态内容的模板:
<div class="modal-header bg-info"> <h3 class="modal-title">Add New Record</h3> </div> <div class="modal-body"> <form class="form-horizontal" role="form"></form> </div> <div class="modal-footer bg-info"> <button class="btn btn-primary" ng-click="save()">Save</button> <button class="btn btn-warning" ng-click="cancel()">Cancel</button> </div>
我的想法是我有范围问题,但我无法追踪它.我在modalController上放了断点.应用程序加载时会发生app.controller()调用,我已经看到了.但是save()和cancel()中的断点永远不会被击中.
有人可以帮我弄清楚为什么模态的按钮什么都不做?