How to create an Angular directive that simply calls a jQuery plugin?

Question

Angular

Forgive me all angular developers that I am such a redneck coder and I have to merge jQuery and Angular together. But it just so happens that I really need to call jQuery plugins (which were not written by stupid people), for example, a very beautiful Datetimepicker that the customer liked.
But every time I call the plugin on every sneeze when changing the DOM or an event in Angular, I don’t like

$scope.setCard = ()=>{
   $scope.card = [1, 2, 3]; // к примеру, какие данные, которые выводятся в DOM посредством компонентов
    
   $(".datatime").datepicker(); // и вот тут то приходится вызывать этот метод, не очень здорово

}

I would be glad if it somehow worked without a call, if the component (template) knew that it was necessary to call the datepicker () plugin in this place
, for example, just specify the datapicker attribute

<div>
   <span ng-repeat="el in card"> {{ el }}</span> 
   <input class="datetime" datapicker />
</div>

Is it possible to do something like this?

Answer 1

angular.directive('datetime', datetimeDirective);

function datetimeDirective() {
   var directive = {
   	restrict: 'C',
        link: link
   }

   return directive;

   function link(scope, element, attrs) {
   	element.datepicker();
   }
}