AngularJS активирует компонент Semantic UI без jQuery

Question

Я создаю сайт с AngularJS и Semantic UI.

Все в порядке с компонентами CSS, но у меня возникла проблема: к активным JavaScript компонентам нет.

Например, можно активировать компонент по

$('.ui.modal').modal('show'); 

Это jQuery стиле кода. Сейчас я в AngularJS без jQuery. Как вы можете справиться с этой проблемой?

Как активировать компонент с помощью jQuery?

(я проверил, что GitHub вопросы и репо, нет ответа.)

Если у меня есть, я могу импортировать минимальный файл только для требований Semantic UI?

Answer 1

Почему вы не используете ngShow и ngHide? Это может быть то, что ваш контроллер выглядит следующим образом:

angular.module('MyApp').controller('ModalCtrl', function($scope, $timeout) { 
    $scope.show = false; 

    $timeout(function() { 
     $scope.show = true; 
    }, 5000); 
}); 

Хотя HTML может выглядеть следующим образом:

<div ng-controller='ModalCtrl'> 
    <div class='ui modal' ng-show='show'> 
     <!-- Modal Contents --> 
    </div> 
</div> 

Этот код будет скрыть элемент с атрибутом ngShow в течение 5 секунд. Через 5 секунд появится модальный. Если вы хотите добавить анимацию, вы можете сделать это, используя $animate.

Лучшее место, чтобы узнать, что вы можете и чего не можете сделать с Угловым изначально, - это посмотреть на list of directives Angular provides. Если вы не можете найти то, что ищете, у вас есть 2 варианта: make your own directive или поиск в Интернете по соответствующей директиве (есть много, многие директивы для Angular уже). В общем, попробуйте избегать jQuery и предпочитайте TM «Угловой путь».