Angularjs 角度模态误差

Angularjs 角度模态误差,angularjs,twitter-bootstrap,angularjs-directive,angular-ui,Angularjs,Twitter Bootstrap,Angularjs Directive,Angular Ui,我已经下载了一些angular UI指令,因为我不需要它们。我已经从和使用此代码下载了modal的最新文件 App.controller('PagesController', ['$scope', '$modal', 'PageFactory', function ($scope, $modal, PageFactory) { $scope.pages = []; PageFactory.getPages().then(function (pages) { $

我已经下载了一些angular UI指令,因为我不需要它们。我已经从和使用此代码下载了modal的最新文件

App.controller('PagesController', ['$scope', '$modal', 'PageFactory', function ($scope, $modal, PageFactory) {

    $scope.pages = [];

    PageFactory.getPages().then(function (pages) {
        $scope.pages = pages;
    }, function (err) {
        console.log(err.message);
    });

    $scope.deletePage = function (page) {
        var modalInstance = $modal.open({
            templateUrl: 'pages-delete-modal.html',
            controller: ['$scope', '$modalInstance', function ($scope, $modalInstance) {
                $scope.ok = function () {
                    $modalInstance.close();
                };

                $scope.cancel = function () {
                    $modalInstance.dismiss('cancel');
                };
            }]
        });

        modalInstance.result.then(function () {
            // ok selected

        }, function () {

        });
    };

}]);
这是模板

<script type="text/ng-template" id="pages-delete-modal.html">
    <div class="modal-header">
        <h3 class="modal-title">Delete Confirmation</h3>
    </div>
    <div class="modal-body">
        Are you sure you want to delete this page?
    </div>
    <div class="modal-footer">
        <button class="btn btn-danger" ng-click="ok()">Delete</button>
        <button class="btn btn-default" ng-click="cancel()">Cancel</button>
    </div>
</script>
我已经将“ui.bootstrap”注入到我的app.js文件中,如您所见

var App = angular.module('MyApp', ['ui.router', 'ui.bootstrap']);
但是,如果我使用这个链接,而不是使用下载的模态文件,它会工作吗

<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.2.js"></script>    

我还下载了transition指令,因为我相信modal指令依赖于此,但我看不出我遗漏了任何其他内容

我将tpl.min.js文件用于transition和modal


非常感谢您的任何帮助

您应该尝试将modalInstance控制器更改为包含项目中实际控制器名称的字符串

$scope.deletePage = function (page) {
    var modalInstance = $modal.open({
        templateUrl: 'pages-delete-modal.html',
        controller: 'otherCtrl'
    });

    modalInstance.result.then(function () {
        // ok selected

    }, function () {

    });
};
然后创建控制器本身

App.controller('otherCtrl',['$scope','$modalInstance', function($scope,$modalInstance){

    $scope.ok = function () {
       $modalInstance.close();
    };

    $scope.cancel = function () {
       $modalInstance.dismiss('cancel');
    };
}]);

添加控制代码定义,如angular.module('myApp')。control('controlName',function($scope)…不确定你的意思…我已经更新了我的帖子,以包含完整的控制器代码。
App.controller('otherCtrl',['$scope','$modalInstance', function($scope,$modalInstance){

    $scope.ok = function () {
       $modalInstance.close();
    };

    $scope.cancel = function () {
       $modalInstance.dismiss('cancel');
    };
}]);