Угловые и JQuery функции нажмите

Так у меня есть HTML-код, который использует функцию углового-х нг-кликУгловые и JQuery функции нажмите

<div class="folder_icon" ng-click="selectFolder()">.....

И моя функция selectFolder() выглядит следующим образом:

$scope.selectFolder = function() { 
    $(".folder_icon").click(function() { 
     if ($scope.folder_select == false) { 
      $(this).parent().closest('div[class^="folder_nr_"]').css({ 
       'border': 'solid', 
       'border-width': '1px', 
       'border-color': '#ff7d43', 
       'box-shadow': '0 0 20px #ff7d43' 
      }); 
      $scope.folder_select = true; 

     } 
     else { 
      $(this).parent().closest('div[class^="folder_nr_"]').css({ 
       'border': '', 
       'border-width': '', 
       'border-color': '', 
       'box-shadow': '' 
      }); 
      $scope.folder_select = false; 
     } 
    }); 
};

Когда я использую эту функцию Мне нужно щелкнуть дважды из-за угловых функций ng-click и $ .jQuery.click(). Могу ли я сделать свою функцию такой же, но без функции jquery click?

источник

2016-05-12 Nikas Žalias

Вы можете ... то, что вы делаете, считается плохой практикой - не смешивайте угловые и jQuery. Причина, по которой он занимает 2 клика, состоит в том, что при первом нажатии вы вызываете функцию Angular, которая создает обработчик jQuery. Второй клик снова вызывает функцию «Угловая», но также вызывает обработчик jQuery, поскольку он существует. – tymeJV

Да. Вы уже говорите «когда пользователь нажимает на это, сделайте это». Вам это не нужно дважды. –

Вы должны делать это Угловой способ - и это действительно очень просто. Во-первых, сделать класс с правилами CSS вы претендуете выше:

.myClass { 
    border: solid 
    border-width: 1px 
    border-color: #ff7d43 
    box-shadow: 0 0 20px #ff7d43 
}

Теперь применить этот класс к вашему элементу через ngClass и переменную BOOL (folder_select)

<div ng-class="{'myClass': folder_select}"></div>

Теперь, когда $scope.folder_select true, этот класс применяется. Теперь обновите свой Угловой:

$scope.selectFolder = function() { 
    $scope.folder_select = !$scope.folder_select; 
}

источник

2016-05-12 12:27:40 tymeJV

wokrs безупречный, спасибо! –

Угловые и JQuery функции нажмите

ответ

Смежные вопросы