Сегодня 26 января, воскресенье ГлавнаяНовостиО проектеЛичный кабинетПомощьКонтакты Сделать стартовойКарта сайтаНаписать администрации
Поиск по сайту
 
Ваше мнение
Какой рейтинг вас больше интересует?
 
 
 
 
 
Проголосовало: 7278
Кнопка
BlogRider.ru - Каталог блогов Рунета
получить код
Хабрахабр: Web-разработка / Блог / Захабренные
Хабрахабр: Web-разработка / Блог / Захабренные
Голосов: 1
Адрес блога: http://habrahabr.ru/blog/webdev/
Добавлен: 2008-06-12 19:52:21 блограйдером ZaiSL
 

Делегирование событий в AngularJS. Попытка разобраться

2014-04-09 16:14:43 (читать в оригинале)


Евгений Гришковец, спектакль 'Как я съел собаку'Гришковец как бы говорит нам «А давайте разберемся»

В комментариях к статье мною был задан вопрос о делегировании в AngularJS в контексте того, что привычный многим императивный способ назначения обработчика для группы элементов аля

$('ul').on('click', 'li', function(){ // обработчик ....

не совсем приемлем в декларативном AngularJS. Собственно, последовал совет использовать свою директиву, решающую проблему делегирования. На самом деле, на ум мне ничего толкового не пришло, и я решил погуглить, наткнулся на такой вариант: создаем директиву, которую необходимо установить на родительский для группы нужных нам элементов узел, который регистрирует слушателя.
Вот демо.
А вот 2 интересующие нас части кода:
html
<ul bn-delegate="li a | selectFriend( friend )">
 
        <li ng-repeat="friend in friends">
 
            <!-- Delegate target. -->
            <a href="#">{{ friend.name }}</a>
            <!-- Delegate target. -->
 
        </li>
 
    </ul>


//js
                    element.on(
                        "click.bnDelegate",
                        selector,
                        function( event ) {
 
                            // Prevent the default behavior - this is
                            // not a "real" link.
                            event.preventDefault();
 
                            // Find the scope most local to the target
                            // of the click event.
                            var localScope = $( event.target ).scope();
 
                            // Invoke the expression in the local scope
                            // context to make sure we adhere to the
                            // proper scope chain prototypal inheritance.
                            localScope.$apply(
                                function() {
 
                                    expressionHandler( localScope );
 
                                }
                            );
 
                        }
                    );


Но подождите. В зависимостях получается jQuery (можно обойтись без него, но тем не менее), но это пол беды. В дебрях директивы все тот же императивный подход. Собственно, в этот момент я решил опубликовать пост, с попыткой разобраться в подходах к делегированию в Angular, в комментарии призываются все, кому есть что сказать по этому поводу.
Читать дальше →

Тэги: angularjs, javascript, веб-разработка, делегирование

 


Самый-самый блог
Блогер ЖЖ все стерпит
ЖЖ все стерпит
по количеству голосов (152) в категории «Истории»
Изменения рейтинга
Категория «Религия»
Взлеты Топ 5
Падения Топ 5


Загрузка...Загрузка...
BlogRider.ru не имеет отношения к публикуемым в записях блогов материалам. Все записи
взяты из открытых общедоступных источников и являются собственностью их авторов.