web-dev-qa-db-ja.com

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']）を使用するのではなく、コードを修正することを望んでいます。

助けてくれてありがとう。

javascriptangularjsangular-ui-bootstrap
17
KoalaFanatic

依存モジュールを使用する前に挿入する必要があります。コードは次のようになります。

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

"angular-bootstrap": "0.12.2"は、パッケージjsonで「angular-ui-bootstrap」：「1.1.2」になります。

アンギュラーブートストラップでバージョン1.1.2が見つからなかった理由を理解できませんでした...

今では魔法のように動作します！

それが役に立てば幸い ... ：）

17
maxime1992

挿入ui.bootstrapアプリケーションモジュールへのモジュール：

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

また、$modal（そしておそらくもっと良い）からのサービスui.bootstrapモジュールの代わりに$uibModal

3
Andrew

それは私のために働いた。 angularJSバージョン1.2.16がありました。 ui-bootstrapの互換バージョンは0.12.0です。使用する前に、常に互換バージョンをグーグルで検索する必要があります。

0
avitash

私は自分の問題を解決しようとします。

Angular-bootstrapの最新バージョンをインストールします

npm install angular-bootstrap or bower install angular-bootstrap
0
Divyang Patel