Блог Makeomatic: разработка сайтов и мобильных приложений

Когда я впервые коснулся Ангуляра, у меня уже был опыт работы с EmberJS и BackboneJS, а так же были определенные представления относительно клиентских фреймворков. На первый взгляд, порог вхождения был ниже, чем у других фреймворков. Это хорошо, так как за короткий срок вы можете добиться значительных результатов в его освоении.

При разработке приложений на AngularJS, сложно получить доступ к данным и сервисам, глубоко спрятанным в вашем приложении через JS консоль в Chrome, Firefox или Internet Explorer. Вот несколько простых фокусов, которые мы можем использовать, чтобы внимательно изучать и контролировать запущенное приложение через браузерную консоль, упрощая тестирование, видоизменение и даже программирования нашего приложения в реальном времени:

За выходные я попытался сделать самодостаточную AngularJS Директиву, которая позволит вам обрезать картинку перед тем, как она загрузится на сервер. Моей целью было создать ее хорошо работающей на мобильных устройствах, быстрой и интуитивно понятной.
Традиционные обрезатели картинок включают в себя рисование прямоугольных границ с помощью подвижной рамки, но я захотел, чтобы ее было проще перетаскивать именно с помощью жестов.

Написание скриптов для ваших веб-сайтов или веб-приложений часто довольно простой процесс: вы пишите скрипт, приклеиваете файл к основному скрипту и подвязываете этот файл к DOM. Плевое дело, но когда доходит до Ангуляра, здесь все совершенно иначе…

Фильтры Ангуляра - одни из самых концептуально сложных элементов в нем. Они немного неправильно поняты и от них мой мозг практически вскипал, пока я изучал их. Фильтры безумно классные, они очень мощны для легкой трансформации наших данных в повторно используемые и масштабируемые кусочки.

##Что за ngMessage?

ngMessages - новая возможность в AngularJS 1.3 для отображения сообщений об ошибках в формах. Работа с формами в Ангуляре является сказкой, так как она основана на взаимодействии с базовыми формами HTML, и их органичном расширении. Директива ngModel без проблем работает со всеми полями ввода, а состояние формы может быть получено в любой момент времени, используя имя формы или конкретного поля ввода данных.

Я много думал о службах для работы с данными и этот аспект Ангуляра, вызывает у меня наибольшее беспокойство. С тех пор я понял, что мое беспокойство было вызвано всего-лишь тем, что Angular.js не диктует и даже не советует как лучше управлять вашей работой с данными.

AngularJS помогает загружать ваше приложение путем внедрения зависимостей, основываясь на упорядоченном создании экземпляров классов. Тем не менее, иногда вам нужно знать завершился ли один из текущих запросов или вызовов функций для того, чтобы инициализировать ваши контроллеры, $scope или сервисы. Эта статья описывает наше решение, которое разбивает жизненный цикл приложения на несколько фраз, названных “instantiation” (начальное создание экземпляров классов), “initialization” (их инициализация) и “running” (работающий режим). Вы можете найти в GitHub загрузочный код и работающую в jsfiddle демо версию.

Магическая связь HTML/JS в AngularJS зависит от очень эффективного dirty checking. Тем не менее, когда вы все-таки достигаете его лимита, ваше приложение обречено быть медленным. Но когда все остальные решения провалились, мы все-таки можем найти решение.

Трансформируем приложение

Переделывая Rails приложение на Angular, я столкнулся с селектом, который грузил некоторые названия штатов США из yaml файла.