угловой и конфликт jQuery с $

Question

Я читал много похожих вопросов на Stack, но я не смог решить свою проблему. У меня есть угловой модуль и контроллер, который отлично работает до Включая библиотеку jQuery. Когда я включаю его (до угловой Lib включен), я получаю

Error: $scope.markersEvent is undefined 

и когда в контроллере я console.log ($) я получаю

function jQuery() 

Я понимаю, что если я включаю Угловое после jQuery не должно быть конфликта, потому что угловой «принимает» значение $. Тем не менее, я попытался

<script type="text/javascript">var j = $.noConflict();</script> 

И console.log ($) покажет

undefined 

Что я должен сделать, чтобы иметь угловую с помощью $ и Jquery с помощью, скажем, JQ? Извините, я довольно новичок в Angular.

Код: Index.html

<link rel="shortcut icon" href=""><!-- for removing favicon error -->  
<!-- script references --> 
<script src="externals/jquery/jquery-1.12.1.js"></script> 
<script type="text/javascript">var j = $.noConflict();</script> 
<script src="externals/angularjs/lodash.js"></script> 
<script src="externals/angularjs/angular.js"></script> 
<script src="externals/angularjs/angular-ui-router.js"></script> 
<script src="externals/angularjs/angular-animate.js"></script> 
<script src="externals/angularjs/angular-simple-logger/dist/angular-simple-logger.js"></script> 
<script src="externals/angularjs/angular-google-maps.js"></script> 
<script src="app/app.js"></script> 
<script src="app/components/partials/eventJoin/eventJoin.module.js"></script> 
<script src="app/components/partials/eventCreate/eventCreate.module.js"></script> 
<script src="app/components/directives/header-menu/header-menu.module.js"></script> 
<script src="app/components/directives/header-login/header-login.module.js"></script> 
<script src="app/components/directives/event-type-choose/event-type-choose.module.js"></script> 
<script src="app/components/directives/sidebar-event-list/sidebar-event-list.module.js"></script> 

eventJoin.module.js

angular.module('eventJoin.module', []) 
//controller start 
.controller('eventJoinController', function ($scope) { 
    angular.element(document).ready(function() { 
     //run when DOM is ready 
     console.log($); 
     initMap(); 
     for (i = 0; i < $scope.markersEvent.length; i++) { 
      initMarkers($scope.markersEvent[i]); //create initial markers 
     } 
    }); 
    //Pre-load document.ready 
    function initMap() { 
     $scope.mapProp = { 
      //karta över sverige 
      center : { 
       lat : 62.5421031, 
       lng : 19.7477994 
      }, 
      zoom : 5, 
     }; 
     $scope.map = new google.maps.Map(document.getElementById('googlemap'), $scope.mapProp); 
    } 
    function initMarkers(info) { 
     console.log("initMarkers function"); 
     new google.maps.Marker({ 
      map : $scope.map, 
      position : new google.maps.LatLng(info.lat, info.lang), 
      title : "test" 
     }); 
    } 
    $scope.markersEvent = [{ 
      city : 'Göteborg', 
      desc : 'This is the best city in the world!', 
      lat : 57.716610, 
      lang : 11.973904 
     }, { 
      city : 'Stockholm', 
      desc : 'Shit city', 
      lat : 59.336574, 
      lang : 18.067879 
     }, { 
      city : 'Kiruna', 
      desc : 'Shit city', 
      lat : 67.858475, 
      lang : 20.225530 
     } 
    ]; 
}) 
//END controller 

app.js

var myApp = angular.module('app', ['ui.router', 'eventJoin.module', 'eventCreate.module', 'header-menu.module', 
'header-login.module', 'event-type-choose.module', 'sidebar-event-list.module']); 
    myApp.controller('appController', function() { 
     var appCont = this; 
     appCont.shit = "hhh"; 
}); 

Answer 1

Вы не файл eventJoin.module.js JS включен в index.html как <script>. Включите его, и он должен работать.

Answer 2

Я решил это сейчас, по крайней мере, на данный момент. После этого video, который в основном делает то же самое, что и документация jQuery для noConflict, то есть размещение других библиотек до jQuery, а затем вызов noConflict, он работает. Причина, по которой я не пробовал это раньше, заключается в том, что 1. Я прочитал, что jQuery должен быть загружен до Angular и 2. это link говорит, что если другие библиотеки загружаются после jQuery, тогда им будет присвоен знак «$» без необходимо использовать noConflict.

Ошибка исчезла, и сайт загрузился, как и предполагалось.