Question

我在我的应用程序中将ui.bootstrap作为依赖项，但我在将$ modal服务注入我的控制器时出现问题。我收到以下错误：

   $modal is not defined

在我的控制器代码中，特别是在我尝试打开模态的下面的函数中：

 function saveAndDisplayReport() {

        var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',
            controller: ModalInstanceCtrl,
            size: size,
            resolve: {
                items: function () {
                    return $scope.items;
                }
            }
        });
        $location.url('index.html#/?reptname=' + vm.reptName);
    }

这是我的reportmaint.js控制器代码标题部分，但我是＆＃39;不清楚如何注入ui.bootstrap（请参阅$ modal参数）：

(function () {
'use strict';
var controllerId = 'reportmaint';
angular.module('app').controller(controllerId, ['$rootScope', '$scope', '$location', 'common',  'datacontext',
                                                'gridHierarchyService', 'reportsContext', '$modal', reportmaint]);

function reportmaint($rootScope, $scope, $location, common, datacontext, gridHierarchyService, reportsContext) {
    var getLogFn = common.logger.getLogFn;
    var log = getLogFn(controllerId);        
    var logErr = getLogFn("error");
  ...
 })();

这是我的app.js，其中＆＃39; ui.bootstrap＆＃39;定义如下：

(function () {
'use strict';

var app = angular.module('app', [
    // Angular modules 
    'ngAnimate',        // animations
    'ngRoute',          // routing
    'ngSanitize',       // sanitizes html bindings (ex: sidebar.js)

    // Custom modules 
    'common',           // common functions, logger, spinner
    'common.bootstrap', // bootstrap dialog wrapper functions

    // 3rd Party Modules
    'ui.bootstrap',          // ui-bootstrap (ex: carousel, pagination, dialog)
    'kendo.directives',      // Kendo UI
    'app.customcontrollers' // Language/Currency settings        
    //'ngjqxsettings'      // jQWidgets init and directives (loaded in index.html)
]);
app.run(['$route', '$rootScope', 'common', 'userService', function ($route, $rootScope, common, userService) {
  console.log("In app.run");
    var getLogFn = common.logger.getLogFn;
    var log = getLogFn('app');

 }]);

}）（）;

在我的index.html文件中我有脚本引用：

  <script src="scripts/ui-bootstrap-tpls-0.10.0.js"></script>

我使用这个plunker作为一个实例，但我仍然在某处出错 - http://plnkr.co/edit/KsADLPaOfY7rtPTdWyYn?p=preview

提前感谢您的帮助......

鲍勃

Answer 1

你的控制器功能似乎没有注入模态（$ modal缺失）;尝试类似的事情：

我不确定reportmaint是否是服务，如果没有，只需将其删除

angular.module('app').controller('reportmaint', ['$rootScope', '$scope', '$location', 'common',  'datacontext','gridHierarchyService', 'reportsContext', '$modal', 'reportmaint',
    function($rootScope, $scope, $location, common, datacontext, gridHierarchyService, reportsContext, $modal, reportmaint) {
        //Client code

    }
]);

将angular-ui注入我的控制器

1 个答案: