javascript - AngularJS错误: $injector:unpr Unknown Provider - $modalInstanceProvider

标签 javascript angularjs twitter-bootstrap angular-ui-bootstrap

我有一个按钮,您单击它应该打开一个模态 onclick。但是,当我单击该按钮时,出现错误“未知提供程序:$modalInstanceProvider <- $modalInstance”。到目前为止我检查了一切。我缺少什么?这是到目前为止的代码。

应用程序。 Node.js - 加载 ui-bootstrap。

var app = angular.module('myApp', ['ngRoute', 'ui.bootstrap']);

services.js - 这是模态服务。

app.factory('modalService',['$uibModal', function($uibModal){
return {
  openMenuModal: function(index, title, description) {
    var modalObj = $uibModal.open({
      templateUrl: 'partials/modal.html',
      backdrop: 'static',
      keyboard: true,
      size: 'sm',
      controller: function($scope, $modalInstance){
        $scope.title = title;
        $scope.description = description;

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

家庭 Controller

app.controller('home', [
'$scope', 
'contentService', 
'$http',
'$uibModal', 
'modalService', function($scope, contentService, $http, $uibModal, modalService){

contentService.then(function(data){
    $scope.data = data;
    $scope.shortcutList = $scope.data.shortcuts;  // list of shortcuts
    $scope.name = $scope.data.user;               // user's name
    $scope.userThumb = $scope.data.userThumb;     // user thumbnail image


    $scope.deleteBox = function(index, title, description){
        modalService.openMenuModal('t', title, description);
    };
});

}]);

模态模板

<div ng-controller="Home">
  <div class="modalBox animated fadeIn">
    <h1> {{title}} </h1>
        <p>{{description}}</p>
        <div class="modal-footer"></div>    
 </div>
 </div>

快捷模板按钮 - 这是我要调用deleteBox()的地方

<button class="btn btn-primary deleteBox" ng-click="deleteBox($index,  'Are You sure you want to delete this?', 'description text')"></button>

最佳答案

使用$uibModalInstance而不是$modalInstance

关于javascript - AngularJS错误: $injector:unpr Unknown Provider - $modalInstanceProvider,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36751962/

相关文章:

javascript - 传入哈希路径 url 的窗口滚动

javascript - javascript修改后如何获取Html代码?

javascript - 将 Chart.js 折线图上的scaleLabel(无刻度或标签)顺时针旋转 90 度

AngularJS 客户端、JAX-RS Jersey Rest 服务 - 应用程序/json 客户端请求抛出 'Error parsing media type'

javascript - 在服务/工厂中使用 $http.get 返回一个集合

html - 如何使用 Bootstrap 将模式带到页面的前面?

javascript - 谷歌可视化动画 a.slice 不是函数

javascript - HTML5 SQLite 数据库位置

javascript - orderBy 不对以下 ngRepeat 表中的项目进行排序

twitter-bootstrap - Bootstrap .container 和 .container-fluid 类之间有什么区别?