Again AngularJS or how dumb is the author?

Question

Angular

Good Tuesday everyone.
The question is.
Piece of code:

$scope.play = function(url) {
    jQuery("#player").attr('src',url);
    document.getElementById('player').play();
    $rootScope.isaudioplayed = '1';
  }

A piece of code that interprets a function

<a ng-click="play('{{audio.url}}');">
        <p><button type="button" class="btn btn-warning"><i class="fa fa-play"></i></button><p class="audio_author">{{ audio.author }}</p> - <p class="audio_name">{{ audio.name }}</p></p>
    </a>

But the alert shows {{audio.url}} , not the link itself..
What can be done in this case, tell me, please?

Answer 1

<a ng-click="play(audio.url);">

Answer 2

Нужно научиться пользоваться ангуляром и не писать подобный г-нокод. Jquery не должен быть в контроллере. Потому что контроллер ничего не должен знать о DOM, ведь он выполняется когда реальный DOM ещё не построен (работает только с виртуальным). Если нужно впилить jquery-плагин, то нужно создать директиву. В директиве в методе postLink (он же link) и нужно работать с DOM. Причём нужно обернуть всё в $(function () { ... }), чтобы код выполнился только по окончанию построения DOM. И в конце вызвать scope.$digest().

angular.module('foo').directive('player', function () {
  return {
    restrict: 'E',
    link: function (scope, element) {
      $(function () {
        твой код
      }
      scope.$digest();
    }
  };
});

Ну и раз уж ты пользуешься жквери, то пиши на нём всё, зачем document.getElementById ?

Answer 3

> Снова AngularJS
> ng-click="play('{{audio.url}}');"
Читайте документацию.