angular ui error:$ modal.open不是函数

Question

我正在尝试使用Angular-UI v0.10.0(http://angular-ui.github.io/bootstrap/)和Angular 1.1.5 来显示模式,我收到以下错误:

错误:$ modal.open不是函数

我不确定或为什么我收到这个错误.这是我的...

HTML:

    <div ng-controller="ModalDemoCtrl">
        <button class="btn btn-default btn-sm" ng-click="open()">open me</button>
    </div>

JS:

app.controller('ModalDemoCtrl', ['$scope', '$modal', function ($scope, $modal) {
    $scope.open = function () {
        var modalInstance = $modal.open({
            templateUrl: 'template.html',
            controller: 'ModalInstanceCtrl', 
            resolve: {}
        });
    };
}]);

app.controller('ModalInstanceCtrl', ['$scope', '$modalInstance', function ($scope, $modalInstance) {
    $scope.ok = function () {
        $modalInstance.close();
    };
    $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
    };
}]);

我只是想先把基础知识放下来......就像让它打开一样.我几乎耗尽了我的资源,所以任何帮助都将不胜感激!谢谢!

Answer 1

我解决了这个问题.

显然,我在角度ui下面有角度带,它覆盖了角度ui.这两个脚本显然彼此冲突.

我正在处理的应用程序很复杂,所以这很容易被忽视.但是,建议的话,坚持使用一个图书馆并保持简单.

感谢大家!

Answer 2

包含$ modal unsuccess导致此错误.

确保:

1. 在angular.js和yourapp.js之间添加源链接

   <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.js"></script>
   <script src="assets/js/ui-bootstrap-tpls-0.10.0.min.js"></script>
   <script src="assets/js/yourapp.js"></script>
   

2. 将ui.bootstrap添加到模块中

   app = angular.module('yourApp', ['ui.bootstrap']); 
   

3. 为控制器添加$ modal独立性

   app.controller('ModalDemoCtrl', ['$scope', '$modal', function ($scope, $modal) {}]);
   

Answer 3

出现此问题的原因是不同版本的angular-modal和angularjs。我在angular-modalv.0.5中也遇到了同样的问题，并得到了解决方案，即

使用：

$modal({......});

代替：

$modal.open({......});

例如：-

 var termAndConModal = $modal({
    title: 'Info',
    controllerAs: 'termAndConModalController',
    template: '../views/partials/term_n_cond_modal.html',//;myModalContent.html',
    show: false
});
$scope.showtermAndConModal = function() {
    termAndConModal.$promise.then(termAndConModal.show);
};
$scope.showtermAndConModal();