Хобрук: Ваш путь к мастерству в программировании

Ошибка неизвестного поставщика AngularJS (Firebase и AngularFire)

Я создавал приложение с использованием Angular и Firebase, и оно работало, пока я не решил изменить каталоги и снова создать его с нуля, чтобы исправить некоторые проблемы совместимости (используя начальную загрузку). Теперь, когда я пытаюсь перейти по своему URL-адресу, я получаю следующую ошибку:

Ошибка: [$injector:unpr] Неизвестный провайдер: $firebaseArrayProvider ‹- $firebaseArray

Я искал похожие вопросы и не нашел ответов, которые решают мою проблему. Я пытался установить Angular через Bower и по ссылке, а также по ссылке на более старые версии AngularFire.js и Firebase.js. Ниже приведен код для каждого из задействованных файлов.

index.html

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
    <link rel="icon" href="img/favicon.png">
    <link rel="stylesheet" href="css/dirty-soda.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
    <script src="http://code.angularjs.org/1.4.8/angular.js"></script>
    <script src="http://code.angularjs.org/1.4.8/angular-route.js"></script>
<head>
</head>
<body>
    <div ng-view></div>
    <script src="app.js"></script>
    <script src="editor/editor.js"></script>
    <script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
    <script src="angularfire.min.js"></script>
    <script src="../src/ace.js"></script>
</body>
</html>

app.js

'use strict';
angular.module('myApp', [
  'ngRoute',
  'myApp.editor'
]).
config(['$routeProvider', function($routeProvider) {
  $routeProvider.otherwise({redirectTo: 'app/editor'});
}]);

editor.js

angular.module('myApp.editor', ['ngRoute'])

.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/editor', {
        templateUrl: 'editor/editor.html',
        controller: 'SnippetCtrl'
    });
}])

.controller('SnippetCtrl', ['$scope','$firebaseArray','CommonProp', function($scope,$firebaseArray,CommonProp) {
    $scope.username = CommonProp.getUser();
    var firebaseObj = new Firebase("<Firebase URL>");
    $scope.snippets = $firebaseArray(firebaseObj);
}]);

  • Вам необходимо включить модули, прежде чем пытаться их зарегистрировать, т.е. включить angularfire до app.js 28.12.2015
  • Мои сценарии находятся в следующем порядке, и я все еще получаю сообщение об ошибке. Есть ли проблема с тем, как я их перечислил? Угловой/AngularRoute/Firebase/AngularFire/app.js/editor.js 28.12.2015

Ответы:


1

Вы забыли включить новый модуль «firebase» в app.js

app.js

angular.module('myApp', [
  'ngRoute',
  'myApp.editor',
  'firebase'
]).

Изменить:

Включите ответ от @Explosion Pills:

В index.html вы также должны переместить свой скрипт src="app.js" в последнюю строку, чтобы сначала загрузить все необходимые файлы js перед их регистрацией.

28.12.2015
  • Получил работу! Огромное спасибо, наверное, я пропустил что-то очень простое. Однако на моей странице editor.html стиль по-прежнему не отображается, хотя инструменты разработки сообщают мне, что файл css был загружен надлежащим образом. Это связано с какими-то изменениями, которые я сделал? Я могу опубликовать скрипку, если нужно. 28.12.2015
  • рад помочь. Скрипка была бы хороша! Поскольку это происходит в другом файле, мне нужно проверить это на вашем коде. 28.12.2015
  • Новые материалы

    Учебные заметки JavaScript Object Oriented Labs
    Вот моя седьмая неделя обучения программированию. После ruby ​​и его фреймворка rails я начал изучать самый популярный язык интерфейса — javascript. В отличие от ruby, javascript — это более..

    Разбор строк запроса в vue.js
    Иногда вам нужно получить данные из строк запроса, в этой статье показано, как это сделать. В жизни каждого дизайнера/разработчика наступает момент, когда им необходимо беспрепятственно..

    Предсказание моей следующей любимой книги 📚 Благодаря данным Goodreads и машинному обучению 👨‍💻
    «Если вы не любите читать, значит, вы не нашли нужную книгу». - J.K. Роулинг Эта статья сильно отличается от тех, к которым вы, возможно, привыкли . Мне очень понравилось поработать над..

    Основы принципов S.O.L.I.D, Javascript, Git и NoSQL
    каковы принципы S.O.L.I.D? Принципы SOLID призваны помочь разработчикам создавать надежные, удобные в сопровождении приложения. мы видим пять ключевых принципов. Принципы SOLID были разработаны..

    Как настроить Selenium в проекте Angular
    Угловой | Селен Как настроить Selenium в проекте Angular Держите свое приложение Angular и тесты Selenium в одной рабочей области и запускайте их с помощью Mocha. В этой статье мы..

    Аргументы прогрессивного улучшения почти всегда упускают суть
    В наши дни в кругах веб-разработчиков много болтают о Progressive Enhancement — PE, но на самом деле почти все аргументы с обеих сторон упускают самую фундаментальную причину, по которой PE..

    Введение в Джанго Фреймворк
    Схема «работать умно, а не усердно» В этой и последующих статьях я познакомлю вас с тем, что такое фреймворк Django и как создать свое первое приложение с помощью простых и понятных шагов, а..