Question

我试图在指令中使用Angular boostrap-ui，但它不起作用，所以我决定使用一个服务，它将使用Angular bootstarp-ui，并将其注入指令。我一直收到这个错误：

未知提供者：ui.bootstrapProvider＆lt; - ui.bootstrap＆lt; - modal＆lt; - monitorCardDirective

Angular app：

    'use strict';
var app = angular.module('app', [ 'ui.bootstrap' ,'restangular']);

app.controller('nav', function($scope, $uibModal, $filter, Restangular) {
        $scope.search = false;
});

app.directive('monitorCard',['modal',function(modal) {
    return {
        link: function(scope, element, attr) {
            element.bind('click',function(){
                modal.open({
                    templateUrl: 'monitoController.html',
                    controller: 'monitorController'
                });
            });
        },
        scope:{
            monitorCard: '='
        }
    };
}]);

app.factory('modal',['ui.bootstrap',function($uibModal){
    var modalInstance = $uibModal.open({
        templateUrl: 'monitoController.html',
        controller: 'monitorController'
    });
    return modalInstance;
}]);

Answer 1

在modal工厂的定义中，替换：

app.factory('modal', ['ui.bootstrap', function($uibModal)

与

app.factory('modal', ['$uibModal', function($uibModal)

作为旁注，请注意此工厂返回一个模态实例。模态实例对象不是模态服务，并且没有open方法，因此您将收到另一个错误。根据您定义的指令判断，您似乎只需要在指令中注入uibModal服务。

如何将服务注入指令？

1 个答案: