AngluarJS + RoR + jQuery - проблемы с jQuery

Question

У меня проблема с jQuery в моем угловом приложении + ror. Я хочу сделать несколько вещей с помощью javascript, например, удаление и добавление классов, но проблема в том, что я не делаю этого внутри углового контроллера или сортировки, я хотел бы сделать это в отдельном файле .js. И вот в чем загвоздка, JQuery работает не так, как надо, например:

$(document).ready(function() { 
    $("a").click(function() { 
     console.log("CLICKED"); 
    }); 
    console.log($("a")); 
}); 

Приведенный выше код не работает, и консоль показывает, что нет никакого «» тегов в моем документе. Даже если есть «тег».

Но этот код ниже работает, и он показывает на консоль всего элемент тела:

$(document).ready(function() { 
    $("body").click(function() { 
     console.log("CLICKED"); 
    }); 
    console.log($("body")); 
}); 

Я использую JQuery рельсы камень, ниже вы можете увидеть мой файл application.js. Я использую конвейер активов, чтобы потребовать все угловые файлы (за исключением тестов, конечно).

application.js:

//= require jquery 
//= require jquery_ujs 
//= require angular.min.js 
//= require angular-resource.min.js 
//= require angular-route.min.js 
//= require ./angular/angular_app_declaration.js 
//= require bootstrap-sprockets 
//= require_tree . 

я произвожу только стандартный вид с Ruby On Rails, который application.html.erb, я использую RoR как API, остальные взгляды обрабатываются угловой маршрутизации, и да «a» добавляется угловым путем генерации templateUrl.

Как я могу сделать работу jQuery?

Answer 1

Для того, чтобы ваш jQuery достиг вашего тега, вы должны использовать Angular Directives.

в вашем HTML, который загружен угловым шаблоном. Вы можете сделать что-то подобное.

<a href="http://example.com" custom-directive >Link</a> 

затем в вашем угловых app.js, сделайте директиву:

app.module('App', []) 

... 

.directive('customDirective', [function(){ 
    return { 
     link : function(scope, elem, attr){ 
      elem.on('click', function(){ console.log(' CLICKED ! '); }); 
     }, 
     restrict : 'A' 
    } 

}])