Ошибка Angularjs - $uibModal провайдера

Я пытаюсь ввести $uibModal в мой проект, однако, когда контроллер загружается, я получаю следующую ошибку:

Error: [$injector:unpr] Unknown provider: $uibModalProvider <- $uibModal <- abilityListController

Я использую NuGet для управления пакетами.

Angularjs: 1.4.8

Бутстрап: 3.3.6

Angular -Ui-Bootstrap: 0.14.3

Вот соответствующий код:

Index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link href="Content/bootstrap.css" rel="stylesheet" />
    <script src="scripts/angular.js"></script>
    <script src="scripts/angular-ui/ui-bootstrap.js"></script>
    <script src="app/app.js"></script>
    <script src="app/homeController.js"></script>
    <script src="app/abilityList/abilityListController.js"></script>
</head>
<body>
    <div ng-app="tecApp">
        <div ng-controller="homeController as vm">
            </div>
            <div ng-controller="abilityListController as vm" ng-if="true">
                <div ng-include="'app/abilityList/abilityList.html'"></div>
            </div>
        </div>
    </div>
</body>
</html>

app.js:

angular.module("tecApp", []);

AbilityListController.js:

angular
    .module('tecApp')
    .controller('abilityListController', AbilityListController);

AbilityListController.$inject = ['$uibModal'];

function AbilityListController($uibModal) {
    var vm = {};
    return vm;
}

Я думаю, что неправильно ввожу, но это может быть связано с тем, как я включил исходные файлы.

Я не вижу ошибок консоли, кроме упомянутых выше.

Я предпочитаю этот синтаксис для моего кода angular, поэтому я надеюсь на исправление своего кода, а не на использование ('controllername', ['$ stuff', 'moreStuff']).

Заранее благодарим за помощь.

Ответы

Ответ 1

Вы должны добавить зависимый модуль перед его использованием. Ваш код должен выглядеть следующим образом:

angular
    .module('tecApp',['ui.bootstrap'])

Ответ 2

Сегодня я потерял 3 часа, чтобы понять, что "angular-bootstrap": "0.12.2" теперь должен быть "angular -ui-bootstrap": "1.1.2" в вашем пакете json.

Я не мог понять, почему версия 1.1.2 не найдена в angular -bootstrap...

Теперь он работает как шарм!

Надеюсь, это поможет...:)

Ответ 3

Вставить ui.bootstrap модуль в свой прикладной модуль:

angular.module("tecApp", ["ui.bootstrap"])

Также вы можете использовать $modal (и, возможно, еще лучше) службу из модуля ui.bootstrap вместо $uibModal

Ответ 4

Это сработало для меня. У меня была версия angularJS 1.2.16. Совместимая версия ui-bootstrap - 0.12.0. Перед использованием необходимо всегда использовать совместимую версию google.