Angularjs: не определена ошибка неперехваченной ссылки в $rootScope

#javascript #jquery #angularjs #ngroute #angularjs-rootscope

#javascript #jquery #angularjs #ngroute #angularjs-rootscope

Вопрос:

Я пытаюсь запустить и получил это сообщение:

Неперехваченная ошибка ссылки: $rootScope не определен в app.js строка 12

вот мой js/app.js

 angular.module('addEvent', ['ngRoute'])
    .config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
        $routeProvider.when('/add-event', {
                templateUrl: 'views/add-event.html',
                controller: 'formCtrl',
                controllerAs: 'eventCtl'
            })
            .otherwise({
                redirectTo: '/'
            });
        $locationProvider.html5Mode(true);
    }])
    .run(['$rootScope', function() {
        $rootScope.event = [];
    }]);
  

это js/controller.js

   angular.module('addEvent')
      .controller('formCtrl', ['eventFactory', function(eventFactory) {
          //$scope.event=[];
          this.event = eventFactory.getAllEvents();
          this.submitForm = function(form) {
              eventFactory.createEvent(angular.copy(form), this.event);
              // $scope.event.push(angular.copy(form));
              console.log($scope.event);
          }
      }])
  

services/eventFactory.js

 angular.module('addEvent')
    .factory('eventFactory', function() {
        var eventFactory = {};
        var events = [];
        eventFactory.getAllEvents = function() {
            return events;
        }
        eventFactory.createEvent = function(event, eventList) {
            events.push(event);
            eventList = events;
            return eventList;
        }
        return eventFactory;
    })    
  

И в index.html Я добавил скрипт таким образом

 <script src="./js/jquery-1.12.4.js"></script>
<script src="./js/bootstrap.js"></script>
<script src="./js/angular.min.js"></script>
<script src="./js/angular-route.js"></script>
<script src="./js/app.js"></script>
<script src="./js/controller.js"></script>
<script src="./services/eventFactory.js"></script>
  

Ответ №1:

Вам нужно ввести $rootScope run() метод

 .run(['$rootScope',function($rootScope){
    $rootScope.event=[];
}]);
  

вместо

 .run(['$rootScope',function(){
    $rootScope.event=[];
}]);
  

Ответ №2:

Вы забыли включить $rootScope сервис в run функцию в качестве параметра, поэтому вы видите ошибку Uncaught ReferenceError: $rootScope is not defined

 angular
  .module('demo', [])
  .run(run)
  .controller('DefaultController', DefaultController);
  
  run.$inject = ['$rootScope'];
  
  function run($rootScope) {
    $rootScope.events = [];
    console.log($rootScope.events);
  }
  
  function DefaultController() {
    var vm = this;
  }  
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="demo">
  <div ng-controller="DefaultController as ctrl">
  </div>
</div>