Здравствуйте. Директива не отрабатывает как положено. Код директивы совсем простой.
user.directive('avatar', function(){
return{
restrict: 'A',
template: '<img class="avatar" src="" alt="avatar" />',
link: function($scope, element, attrs){
element.find('img').attr('src', attrs.avatar);
}
};
});
В код вставляется адрес картинки, но директива его не принимает.
В первом случае директива отрабатывается (успешно) из контроллера userCtrl, во втором случае из родительского контроллера. В исходнике в обоих случаях виден адрес картинки. Почему директива его не забирает в одном случае?
Если же в шаблоне директивы прописать непосредственно
template: '<img class="avatar" src="{{user.avatar}}" alt="avatar" />',
Тогда картинка отображается, но такой вариант лишает абстракции. jsfiddle.net/t2yaLdq6/7
Дополнение: Проблема решена. В родительском контроллере директива исполняется прежде, чем значение присваивается переменной. Решить можно добавив следующий код:
scope.$watch(attrs.avatar, function(val){
element.find('img').attr('src', val);
});
Stepan Kasyanenko предложил более правильное решение в ответе.