Пробовал почти все но безуспешно.

Я хотел выполнить действие только в том случае, если щелкнул элемент с именем класса «ion-android-favourite-outline».

Мой исходный элемент показан ниже

<i id="{{product.product_code}}" class="icon ion-android-favorite-outline"></i>

Я могу сделать это, используя "restrict: 'C'" в коде директивы.

В директиве, как только я закончу обработку данных, я меняю класс исходного элемента на «ion-android-favourite», как показано ниже.

.directive(
    "ionAndroidFavoriteOutline",
    function(sessionStorageService, productService){
        return{
            restrict: 'C',
            link: function(scope, element, attrs) {
                element.bind("click" , function(e){
                    var productCode =   attrs.id;
                    console.log(attrs.class);   // on every click i get class name as 'ion-android-favorite-outline' event though html has class name as 'ion-android-favorite'
                    if (sessionStorageService.isLoggedIn()) {
                        productService.trackProduct(productCode).then(function(response){
                            if (response.data.status == "success") {
                                element.removeClass("ion-android-favorite-outline").addClass("ion-android-favorite");
                            } else {
                                element.removeClass("ion-android-favorite").addClass("ion-android-favorite-outline");
                            }
                        });

                        scope.$apply();
                    }

Я вижу изменение имени класса исходного элемента и его отражение в пользовательском интерфейсе.

Однако, если я снова нажимаю на исходный элемент (класс которого был изменен в предыдущем действии щелчка), все равно вызывается код директивы.

Зачем ???

Я пробовал scope. $ Apply, replace: true и т.д., но обходного пути нет.

Пожалуйста, помогите.

0
Tech Boost 28 Фев 2016 в 17:40

2 ответа

Лучший ответ

@stephan, ответил правильно.

element.unbind("click");

Тем не менее, у меня есть вопрос: есть ли необходимость отвязать событие клика от элемента?

-1
Tech Boost 3 Мар 2016 в 14:02

Вы можете использовать директиву, как показано ниже:

 <i id="{{product.product_code}}" class="ion-android-favorite-outline" ion-android-favorite-outline></i>
0
Ali SadeghipourKorabaslo 28 Фев 2016 в 14:59