Question

我们有一个自定义指令，可以在复选框周围生成html。这使用transclusion来注入在其中传递的内容。它看起来像这样：

somecheckbox.js

angular.module('namespace.directives')
.directive('someCheckbox', function() {
  return {
    templateUrl: 'directives/checkbox.html';
    restrict: 'E',
    transclude: true
  }
}]);

指令/ checkbox.html

<label class="styling" ng-transclude>
    ... some other html
</label>

我们在整个应用程序中广泛使用模态，并且正在将所有内容转换为bootstrap的angular指令。我们已经创建了一个控制器来处理在整个应用程序中零星出现的特定类型的模态：

angular.module('namespace.controllers').controller('LegalModalController',
       ['$scope', '$modal',
function($scope,   $modal) {
  $scope.showLegalModal = function(title, legalTextLocation) {
    $modal.open({
      templateUrl: 'modals/legal.html',
      controller: 'sc.LegalModalInstanceController',
      resolve: {
        modalTitle: function() {
          return title;
        },
        template: function() {
          return eulaTextLocation;
        }
      }
    });
  };
}]);

回到指令篇，有一种情况我们需要在checkbox指令中添加一个链接到法律控制器以弹出模态窗口的链接。这是迄今为止所做的：

<some-checkbox>Click <a href ng-controller="LegalModalController" ng-click="showLegalModal()">here</a> to...</some-checkbox>

我们遇到的问题是我们完全无法将$ modal注入控制器而不会出现以下错误：

未知提供商：$ modalProvider＆lt; - $ modal

我到处寻找，但我没有找到任何其他人在这种情况下。有谁知道这个问题的潜在根源是什么？这种链接适用于我们不使用指令的每种情况。

这是启动应用程序的main.js文件：

angular.module('namespace.modules.main', ['namespace.core', 'ui.select2', 'ngSanitize', 'ui.sortable', 'infinite-scroll', 'ui.bootstrap']).
config(['$routeProvider', '$locationProvider', '$httpProvider', '$compileProvider', 
function($routeProvider, $locationProvider, $httpProvider, $compileProvider) {
    routeProvider = $routeProvider;
    $locationProvider.html5Mode(true).hashPrefix('!');

    $httpProvider.defaults.headers.patch = {};
    $httpProvider.defaults.headers.patch['Content-Type'] = 'application/json; charset="UTF-8"';

    // Allow telephone hyperlinks
    $compileProvider.urlSanitizationWhitelist(/^\s*(https?|mailto|tel):/);

}]).run(
         ['$rootScope', '$location', '$timeout', '$window', '$route'
  function($rootScope,   $location,   $timeout,   $window,   $route) {
    // set up $rootScope and route provider here
});

Answer 1

我能够弄清楚。我们的应用程序中失败的特定页面是它自己的模块，因此没有正确的bootstrap ui依赖项。糟糕＆gt;。＆lt;

AngularJS：在嵌套在指令内的控制器中注入$ modal时出错

1 个答案: