понимания угловых директив

Я использую Angular.JS версию 1.1.5 и я использую следующий код, который я нашел на StackOverflow, чтобы изменить фоновое изображение DIV:понимания угловых директив

angular.module('app', []) 
.directive('ng-background', function(){ 
    return function(scope, element, attrs){ 
    var url = attrs['ng-background']; 
    element.css({ 
     'background-image': 'url(' + url +')', 
     'background-size' : 'cover' 
    }); 
    }; 
});

Тогда в моем HTML, у меня есть следующий (шаблон нефрита)

html(ng-app) 
    div(ng-controller='myCtrl') 
    div.big-image(ng-background='{{flags.imgSrc}}')

Теперь, пожалуйста, рассмотреть вопрос о том, что flags.imgSrc делает работу и возвращает правильный URL изображения, как я ранее тестировал с img(ng-src='{{flags.imgSrc}}').

Проблема в том, что она не работает вообще! Я попытался поставить console.log('test') внутри моей директивы, но он, похоже, не вызван. Любые идеи почему? Заранее спасибо.

источник

2013-09-14 john smith

Это потому, что вам нужно переименовать директиву ngBackground Угловое новообращенных змеиного случае к верблюжьего для вашего удобства.

Пример:

.directive('ngBackground')

HTML

div.big-image(ng-background='{{flags.imgSrc}}')

Нормальный Пример

App.directive('myAmazingDirective');

HTML

<div my-amazing-directive></div>

Также вам нужно будет получить свои атрибуты, используя camelCase, а также так.

var url = attrs.ngBackground;

источник

2013-09-14 22:24:47 iConnor

Я не могу видеть любое удобство в том, что! Спасибо, в любом случае! Другое дело, как насчет attrs ['ng-background'] только внутри директивы? должен ли он быть на камбеле или в змеиной оболочке? –

это правильно, возможно, это просто большая кривая обучения. Во всяком случае, мне все еще кажется, что я не работаю, чтобы проверить это? Я добавил console.log непосредственно перед оператором return, это правильно? если бы это называлось, все было правильно? –

ОК, понял. да, проблема, кажется, еще одна ... у вас есть 2 минуты в чате? –

Ваша директива, вероятно, никогда не будет вызвана. Для директивы, названной «ng-background», я даже не знаю, как вы это называете. Обычно название директивы, измененное верблюдом, преобразуется в пунктирное имя, которое вы используете в своем HTML.

Процитировать пример из официальной документации AngularJS. Они создают директиву с именем myCurrentTime и вызвать его с помощью:

<span my-current-time="format"></span>

Посмотрите на «Директивами написания (короткая версия)» на этой странице: http://docs.angularjs.org/guide/directive

источник

2013-09-14 22:25:04

понимания угловых директив

ответ

Смежные вопросы