Запустить код директивы после ng-src

У вас может быть $observe внутри вашей директивы, которая будет работать так же, как и у $watch но разница в том, что она вычисляет выражение {{}} интерполяции.

Внутри $observe вы можете увидеть, имеет ли значение ng-src единственный вызов метода директивы. иначе подождите.

link: function(scope, element, attrs){
   attrs.$observe('ngSrc', function(newVal, oldVal){
       if(newValue){
           //call desired code when 'ng-src' have value
       }
   });
}

Существует несколько рецептов для выполнения кода в link в тот момент, когда существует директива DOM '. Один использует тайм-аут с нулевой задержкой

$timeout(function () {
  ...
});

Обычно это предпочтительнее, если вы после визуализации DOM или интерполированных значений. Это не вариант здесь, потому что templateUrl используется и директива шаблон загружается асинхронно, а шаблон не доступен во время стадии компоновки.

В другом рецепте используются наблюдатели за наблюдателями/наблюдателями атрибутов (одноразовые, если вам не нужны привязки данных).

var unobserveNgSrc = attrs.$observe('ngSrc', function (ngSrc, oldNgSrc) {
  if (!ngSrc) return;
  unobserveNgSrc();
  ...
})

Он выполняется сразу после функции prelink, поэтому почему они являются даже отдельными функциями?

Такое поведение подсказывает, для чего его можно использовать. В родительском preLink можно сделать некоторые вещи, которые должны предшествовать дочернему preLink или последнему можно извлечь выгоду, что вы редко найдете полезным для простых директив. И parent postLink выполняет последний, и что хороший момент для "хорошо, все мои дети уже скомпилированы и связаны, пусть что-то наконец".