Tag Archives: директива
Директивы для обработки DOM-событий в AngularJS
Всё достаточно просто, много раз использовал, но надо бы и здесь выложить. Допустим, нам нужно вешать AngularJS-обработчики на DOM-события mouseenter и mouseleave. Для этого пишем генератор директив по массиву: var directives = angular.module(‘CommonDirectives’, []); angular.forEach([‘Mouseenter’, ‘Mouseleave’], function (eName) { var aName = ‘mm’ + eName, eName = eName.toLowerCase(); directives. directive(aName, [‘$parse’, function($parse) { return { …
AngularJS: директива для вставки html выполнением всех скриптов
Допустим, мы получаем с сервера код вида <script>alert(1234)</script><script type=»text/javascript»>alert(12345)</script> <script type=»asdf»>alert(1234)</script><script src=»/js/alert.js»>alert(1234)</script> <span style=»color: red;»>1234</span> и хотим его вывести в шаблоне. Для обычного вывода с парсингом html-тегов достаточно <div ng-bind-html=»ad.html | trustAsHtml»></div> Но, к примеру, jQuery умеет выполнять все скрипты, которые есть в строке ad.html. AngularJS такого из коробки не умеет. Поэтому была написана директива …
AngularJS: особенности ng-switch (и, возможно, ng-if)
Элементы с директивой ng-switch-when(ng-switch-default) вставляются в конец DOM. И поэтому, к примеру, список будет выводиться не в том порядке, как это задумано. В таких случаях лучше использовать ng-show/ng-hide <div ng-app ng-controller=»MyCtrl»>{{val}} <ul ng-switch=»val»> <li>1</li> <li ng-switch-when=»1″>2</li> <li>3</li> </ul> </div>
AngularJS Unknown provider: $scopeProvider <- $scope <- selectorDirective
Такая ошибка может возникнуть при создании новой директивы, особенно при выносе контроллера в директиву. Скорее всего, она возникла из-за того, что была объявлена зависимость от $scope, например: directives.directive(‘selector’, [‘$scope’, ‘GeoSelect’, function selectorGeoExtended($scope, GeoSelect) { return { restrict: ‘AE’, replace: true, scope: {}, template: ‘<div></div>’, link: function ($scope) { // @debug console.log($scope); } }; }]); Объявление …
Watch angular attrs and scope
attrs.$observe и $scope.$parent.$watch Подробнее:
ng-options в Angular.js
Который раз натыкаюсь на эти грабли, и который раз забываю. Чтобы заработало ng-options и вообще много чего с селектами, нужно обязательно указать модель для селекта (<select name=»{{name}}» ng-model=»day» class=»…»>), без этого работать не будет, т.к. (отрывок из исходников angular.js): // if ngModel is not defined, we don’t need to do anything if (!ctrls[1]) return;
Видео о директивах в AngularJS
Сколько уже раз забываю написать про хорошие видео о директивах: Тонкости написания директив от создателя AngularJS (Misko Hevery) http://youtu.be/WqmeI5fZcho Тестирование директив (Vojta Jina) http://youtu.be/rB5b67Cg6bc