web-dev-qa-db-ja.com

不明なプロバイダー：$ uibModalInstanceProvider-Bootstrap UI modal

UI Bootstrap modal。

1つのコントローラーにこれがあります：

app.controller("tableCtrl",['$scope','$http','$uibModal','$log' ,function ($scope, $http,$uibModal,$log) {
  $scope.open = function (size,selectedUser) {
  var modalInstance = $uibModal.open({
    animation: $scope.animationsEnabled,
    templateUrl: 'myModalContent.html',
    controller:'ModalInstanceCtrl',
    size: size,
    resolve: {
      user: function () {
        return selectedUser;
      }
    }
  });
}]);

別の私はこれを持っています：

app.controller('ModalInstanceCtrl',['$scope','$uibModalInstance','user', function ($scope, $uibModalInstance, user) {
  $scope.user = user;
  $scope.ok = function () {
    $uibModalInstance.close();
  };
}]);

myModalContentは次のようになります。

<script type="text/ng-template" id="myModalContent.html">
    <div class="modal-header"><h1>EDIT</h1></div>
    <div class="modal-body"> 
        {{patient.patient_id}}
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" type="button" ng-click="ok()">OK</button>
    </div>
</script>

HTMLでtableCtrlを呼び出し、次のようにopen関数を呼び出します。

<button class="btn btn-primary" ng-click="open('lg',patient)">Edit</button>

編集ボタンをクリックすると、次の例外が表示されます。

Unknown provider: $uibModalInstanceProvider <- $uibModalInstance

this plunker を見ましたが、助けにはなりませんでした。

なにが問題ですか？

javascriptangularjsangular-ui-bootstrap
15
Marcinek

私は同じ問題を抱えていたので、私のソリューションからあなたのシナリオを解決する方法は次のとおりです

app.controller("tableCtrl",['$scope','$http','$uibModal','$log' ,function ($scope, $http,$uibModal,$log) {
  $scope.open = function (size,selectedUser) {
  var uibModalInstance = $uibModal.open({
    animation: $scope.animationsEnabled,
    templateUrl: 'myModalContent.html',
    controller:function($uibModalInstance ,$scope,user){
     $scope.ok = function () {
            $uibModalInstance.dismiss('cancel');
         };

    },
    size: size,
    resolve: {
      user: function () {
        return selectedUser;
      }
    }
  });
}]);
20
GeorgeKach

特定された問題は次のとおりです。コントロールがHTMLページから再初期化されました。 Modalコントローラーが1か所から初期化されていることを確認してください

5
Aashish Patil

私はまったく同じ問題を抱えていました。 angularとui-bootstapライブラリの両方を更新すると、問題が修正されました。 bowerを使用してui-bootstrapを更新します。それは、それと連携しているangularのバージョンを提案します。お役に立てば幸いです。

3
Mohamad Ghafourian

Angle-ui/bootstrapの異なるバージョンには、異なる注入変数名があります。

angular-ui/bootstrapの例 をご覧ください

1
KaiserKatze

インライン、およびuibModalInstanceオブジェクト定義内にコントローラー機能があるため、同じ問題が発生していました。

0.14.3にアップグレードした後、javascriptがu化されたとき、uibModalInstanceは不明なプロバイダーをスローしていました。 「app.controller」を使用してコントローラーを定義すると、問題が修正されました。

1
JimmyBob

この問題は、modal.open呼び出しではなくテンプレートHTMLでコントローラーを定義したときに発生することがわかりました。

1
nuander