3

Я пытаюсь ввести ui.bootstrap в свой модуль, называемый «приложение». Я уже включил UI-загрузчик файла JavaScript в моем HTML, но я не получаю ниже ошибки, независимо от того, что я делаю:Не могу ввести ui.bootstrap в мой модуль

Uncaught Error: [$injector:modulerr] 

Если удалить все зависимости для ui.bootstrap, ошибка уходит.

Порядок импорта js в тег заголовка, все из которых загружаются штрафом. (Проверено в Chrome Дев инструментов)

<script src="/Scripts/angular.min.js"></script> 
<script src="/Scripts/angular-route.js"></script> 
<script src="/Scripts/angular-ui-router.min.js"></script> 
<script src="/Scripts/angular-animate.js"></script> 
<script src="/Scripts/ui-bootstrap-tpls-1.2.5.min.js"></script> 

Текущая AngularJS версия 1.5.2

app.js

(function() { 
    'use strict'; 

    var app = angular.module('app', [ 
     // Angular modules 
     'ngRoute', 
     'ngAnimate', 
     'ui.bootstrap', 
     // Custom modules 
     // 3rd Party Modules 
     'ui.router' 
    ]); 

    app.config(['$locationProvider', '$stateProvider', '$urlRouterProvider', '$modal', function ($locationProvider, $stateProvider, $urlRouterProvider, $modal) { 
     $locationProvider.html5Mode(true); 

     $urlRouterProvider.otherwise('/'); 
     $stateProvider 
      .state('home', { 
       url: '/', 
       controller: 'frontpageController', 
       templateUrl: 'app/views/frontpage.html', 
       data: { 
        authorize: false 
       } 
      }) 
      .state('login', { 
       url: '/login', 
       controller: 'loginController', 
       templateUrl: 'app/views/login.html', 
       data: { 
        authorize: false 
       } 
      }) 
      .state('profile', { 
       url: '/profile/:userId', 
       controller: 'profileController', 
       templateUrl: 'app/views/profile.html', 
       data: { 
        authorize: true 
       } 
      }) 
      .state('error', { 
       url: '/error', 
       controller: 'errorController', 
       templateUrl: 'app/views/404.html', 
       data: { 
        authorize: false 
       } 
      }) 
    }]); 

    app.run(function ($rootScope, loginService) { 
     $rootScope.$on('$stateChangeStart', function (event, toState, toParams) { 
      var authorize = toState.data.authorize; 

      if (authorize && typeof $rootScope.currentUser === 'undefined') { 
       event.preventDefault(); 
       // get me a login modal! 
       loginService() 
      } 
     }); 

    }); 

})(); 
+0

Не думаю, что это связанно, но вы используете как ngRoute и ui.router, Я предполагаю, что вы можете удалить ngRoute, так как вы используете состояния. – Tomer

+0

. Вы совершенно правы, и я также попытался удалить его, но я ничего не имею в виду. Я держу оба ATM, потому что я играю с обоими состояниями и маршрутами. –

ответ

2

Вы не можете вводить услуги в конфигурацию модуля, это разрешает только провайдерам. $modal также переименован в $uibModal в последнюю ui-bootstrap (чтобы переименовать ваши контроллеры).

Так что удалите '$ modal' из вашего .config, вводите его только тогда, когда вы его используете.

0

Вы уверены, что пользовательский интерфейс самозагрузки имеет только один файл JS? Проверьте все папки ui bootstrap и добавьте, если вам не хватает каких-либо других JS-файлов.

+0

Я уверен, но не уверен на 100%. Я попытался импортировать ui-bootstrap.js + ui-bootstrap.tpls.js одновременно, в разных порядках, но по-прежнему происходит одна и та же ошибка –

+0

Кроме того, похоже, что разные версии - это один и тот же ui-bootstrap, но с шаблонами и без них, а также нормальные и миниатюрные. –

0

Вы должны добавить tpls и library для ui bootstrap. Например:

<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.5/ui-bootstrap-tpls.js"></script> 

и

<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.5/ui-bootstrap.js"></script> 
+0

Я не могу найти место на их сайте, где он говорит мне импортировать оба. Я просто попробовал, с тем же результатом:/ –

0

Это может быть вариант вашей угловой. он говорит, что на сайте требуется AngularJS 1.4.x или выше.

+0

Я также проверил это, но забыл упомянуть об этом в сообщении. Моя угловая версия - 1.5.2 –

-1

Версия: угловая самозагрузка: "~1.1.1",

<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script> 

И $modal модуль изношена и вместо него использовать в $uibModal

+0

Очень неопределенный ответ + зачем приносить беседу в уравнение, когда я спрашиваю о том, почему я не могу получить ui-bootstrap, введенный в моем модуле. Вы, где верно, что модальный стиль устарел. –

Смежные вопросы