AngularJS: $инжектор: ошибка unpr при использовании ngAnimate

Я пытаюсь добавить ngAnimate к моим зависимостям приложений angular. Вот мой файл приложения angular:

var carApp = angular.module("carApp", ["ngAnimate"]);

Вот мой контроллер TableBodyCtrl:

carApp.controller("TableBodyCtrl", function($scope, $http){
    $scope.loading = false;
    ...
});

Вот мой TablePanelCtrl:

carApp.controller("TablePanelCtrl", function(){
    this.tab = 1;
    ...
});

Мой контроллер находится в разных файлах в папке controller.

Вот script загрузки angular библиотек:

<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/angular-animate.min.js"></script>

Ниже приведен пример загрузки script моего файла приложения angular:

<script type="text/javascript" src="js/carApp.js"></script>

Ниже приведен список загрузок script моих контроллеров:

<script type="text/javascript" src="js/controllers/TablePanelCtrl.js"></script>
<script type="text/javascript" src="js/controllers/TableBodyCtrl.js"></script>

Когда я запускаю свое веб-приложение, я получаю эту ошибку:

Unknown provider: $$qProvider <- $$q <- $animate <- $compile

https://docs.angularjs.org/error/$injector/unpr?p0=$$qProvider%20%3C-%20$$q%20%3C-%20$animate%20%3C-%20$compile

Эта ошибка появилась только после того, как я добавил "ngAnimate" в мои зависимости angular.

Как я могу это исправить?

Ответ 1

Я установил ту же самую настройку, что и в этом plnkr,

Ошибок нет. То, что вы делаете, является правильным.

Порядок создания файлов и создания модуля с помощью 'ngAnimate' в качестве зависимости

var carApp = angular.module("carApp", ["ngAnimate"]);

- правильный способ сделать это.

Прежде всего, нужно иметь в виду:

из Angularjs docs

Существует два типа URL-адресов angular script, на которые вы можете указать, один для разработка и одна для производства:

angular.js. Это понятная для человека версия без ограничений, подходит для веб-разработки. angular.min.js - это минимизированный версия, которую мы настоятельно рекомендуем использовать в процессе производства.

то же самое для angular -animate.js.

Это поможет вам в разработке, пока оно покажет вам лучшие отчеты об ошибках.

Другое дело, даже если вы используете мини-версию angularjs, вы получаете ссылку на "длинную описательную" ошибку msg и просматриваете ссылку , предоставленный с вашей ошибкой msg, я увидел это:

Неизвестная ошибка поставщика также может быть вызвана случайно переопределение модуля с использованием API angular.module, как показано в следующий пример.
angular.module('myModule', [])
.service('myCoolService', function () { /* ... */ });

angular.module('myModule', [])
// myModule has already been created! This is not what you want!
.directive('myDirective', ['myCoolService', function (myCoolService) {
  // This directive definition throws unknown provider, because myCoolService
  // has been destroyed.
}]);
Чтобы устранить эту проблему, убедитесь, что вы только определяете каждый модуль с синтаксисом angular.module(name, [требуется]) один раз через весь ваш проект. Извлеките его для последующего использования с помощью angular.module(name). фиксированный пример показан ниже.
angular.module('myModule', [])
.service('myCoolService', function () { /* ... */ });

angular.module('myModule')
.directive('myDirective', ['myCoolService', function (myCoolService) {
  // This directive definition does not throw unknown provider.
}]);

Ответ 2

У меня была такая же ошибка, и я понял, почему это происходит.

Основная причина заключалась в том, что я был в зависимости от "angular -animate": "1.3.0", поэтому bower использовал Angular v1.3, хотя остальная часть проекта зависела от Angular 1.2.

Просто используйте

"angular-animate": "~1.2.0"

вместо

"angular-animate": "~1.3.0"

в файле bower.json. После bower install все должно работать!

Тот же ответ здесь: fooobar.com/questions/413886/...

Ответ 3

У меня была та же проблема, решенная

bower update.

Ответ 4

У меня была такая же проблема, причина, по-видимому, в конфликте между версиями этих библиотек.

Я не видел эту ошибку после обновления до AngularJS v1.3.14 от v 1.2. Попробуйте разные версии и проверьте их совместимость.