Директива атрибута angularJS к angular: могу я обновить или должен переписать

Question

Я нахожусь в процессе обновления довольно старого angularJS приложения до angular 4, позже я обновлю angular себя до более новой версии.

Я нахожусь в ситуация, когда у меня есть некоторые директивы атрибутов, и я не могу найти решение о том, как превратить это в angular версию. Angular документы говорят:

Не все виды директив AngularJS могут быть обновлены. Директива действительно должна быть директивой компонента, характеристики которой описаны в руководстве по подготовке выше.

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

function textPopover() {
  return {
    restrict: 'A',
    template: '<img style="height: 30px; padding: 7px;" ng-src="{{label}}"/>',
    link: function (scope, el, attrs) {
      scope.label = attrs.popoverLabel;
      var htmlelement = '<h5 style="color: #EFEFEF; background-color: #DF134C;">' + attrs.popoverHtml + '</h5>';
      //@ts-ignore
      $(el).popover({
        trigger: 'hover',
        html: true,
        content: htmlelement,
        placement: attrs.popoverPlacement
      });
    }
  };
}

, и она используется так:

<img style="position: absolute;top:1px;left:178px" id="ean-info"
     text-popover="" src="../images/questionmark.png"
     popover-label="../images/questionmark.png"
     popover-placement="bottom"
     popover-html="{{eanInfoHtml}}"/>

Есть ли способ обновить эту директиву, или мне нужно переписать все в angular. И если да, то может ли кто-нибудь мне помочь или указать мне правильное направление в виде документов, блогов или чего-то в этом роде.

Спасибо