ui.bootstrap 0.12 中的 $modalInstance 不起作用答案

【问题标题】：$modalInstance in ui.bootstrap 0.12 not workingui.bootstrap 0.12 中的 $modalInstance 不起作用
【发布时间】：2015-01-10 14:01:10
【问题描述】：

我正在使用 JQuery 1.3.8 和 ui.bootstrap 版本：0.12.0。

当我在控制器中使用$modalInstance时，我的页面不会加载，但如果我删除它，页面可以正常工作，但模式命令不起作用。

我的代码：

angularFormsApp.controller('efController',
function efController($scope, $window, $routeParams, $modalInstance ,DataService) {

    if ($routeParams.id)
        $scope.employee = DataService.get_employee($routeParams.id);
    else
        $scope.employee = { id: 0 };

    //$scope.employee = DataService.employee;

    $scope.editableEmployee = $scope.employee;

    $scope.departments = [
        "Engineering",
                "Management",
                "Finance",
                "IT"
    ];

    $scope.submitForm = function () {
        if ($scope.editableEmployee.id = 0) {
            DataService.insertEmployee($scope.editableEmployee);
        }
        else {
            DataService.updateEmployee($scope.editableEmployee);
        }


        $scope.employee = angular.copy($scope.editableEmployee);
        //$window.history.back();
        $modalInstance.close();

    };

    $scope.cancelForm = function () {
        //$window.history.back();
        alert($modalInstance);
        $modalInstance.dismiss();

    };

});

我使用 open 方法的代码： angularFormsApp.controller("HomeController", 函数 ($scope, $location, $modal ,DataService) {

    $scope.showCreateEmployeeForm = function () {

        //$location.path('/newEmployeeForm');
        $modal.open({
            templateUrl: "app/EmployeeForm/efTemplate.html",
            controller: "efController"
        });

    };

    $scope.showUpdateEmployeeForm = function (id) {
        $location.path('/updateEmployeeForm/'+ id );
    };

});

请在这里帮助我为什么页面无法加载。我正在使用 .NET 的 MVC 模板。

【问题讨论】：

请通过在您的解析方法中调用 $modal.open() 来显示您正在创建 $modalInstance 的代码。如果你没有这样的方法，只是想注入 $modalInstance，那就是你的问题。

标签： angularjs twitter-bootstrap asp.net-mvc-4 angular-ui

【解决方案1】：

angular.module('myModule', ['ui.bootstrap']);

您是否像上面的代码一样在模块配置中包含了 BootStrap 依赖项，这是必要的在我们使用 Boot Strap 时添加，请检查它

【讨论】：

感谢您的回复。是的，我包括在内。 var angularFormsApp = angular.module('angularFormsApp', ['ngRoute', 'ui.bootstrap'])