Заменить / переключить событие ng-click после щелчка

Question

Я создаю веб-приложение, которое позволяет пользователям отмечать, какой эпизод шоу они смотрели. При загрузке он имеет событие ng-click, называемое markEpisode (). После щелчка я хочу, чтобы событие ng-click изменилось на unmarkEpisode ().

В настоящее время он удаляет атрибут ng-click, а затем повторно добавляет новый. Но, похоже, не работает.

// Unmark Episode As Watched
$scope.unmarkEpisode = function(episode_number, season_number, id) {
  $http.post('/api/show/' + id + '/season/' + season_number + '/episode/' + episode_number + '/unwatch')
    .then(response => {
      $('.episode-artwork[data-episode-season="' + episode_number + season_number + '"]').removeAttr('ng-click').attr('ng-click', 'markEpisode(' + episode_number + "," + season_number + "," + id + ')');
    });
};

Вот как я добавляю эпизоды в

$('#episodes .row').append($compile('<div class="col-sm-3">' +
  '<div data-episode-season="' + response.data.episodes[i].episode_number + response.data.episodes[i].season_number + '" class="episode-artwork" ng-click="markEpisode(' + response.data.episodes[i].episode_number + "," + season_number + "," + id + ')" style="background-image: url(' + imageURL + ')">' +
  '</div>' +
  '<p class="episode-name">' + response.data.episodes[i].episode_number + '. ' + response.data.episodes[i].name + '</p>' +
  '<p class="episode-text">' + response.data.episodes[i].overview + '</p></div>')($scope));

Answer 1

Было бы хорошо иметь две ссылки или кнопки: одна для отметки, одна для снятия отметки.

Каждая кнопка должна иметь * ngIf = "item.isMarked" или * ngIf = "! Item.isMarked ".

Я думаю, что смешивать angular и jquery - плохая идея. Если вы работаете с angular, нет необходимости манипулировать dom через jQuery.