AngularJS: ng-click "хорошая практика"? Почему в AngularJS нет ng- {event}?

Я только начал изучать AngularJS и бороться с некоторыми концепциями AngularJS. Было бы здорово, если бы кто-нибудь мог объяснить мне несколько моментов...

  • Я понимаю, что ng-click технически не совпадает с onclick (см. здесь), но оба помещены в разметку. Я думал, что это будет "плохая практика"? Почему это одна из основных концепций AngularJS, если большинство людей говорят, что это "плохо"? Я подумал, что лучше выбрать элемент DOM из JavaScript, а не размещать логику в разметке.

  • Если ng-click - это правильный способ реагировать на события click в AngularJS, что мне делать с другими событиями DOM? Я вижу, что существует несколько других директив, таких как ng-mouseover, но не все события DOM имеют эквивалент AngularJS. Как я могу обработать событие "drop" в AngularJS (следовательно, в методе AngularJS - не обычный способ)? Чтобы быть ясным: я хочу перетащить файл в мой webapp.

Большое спасибо, Pipo

Ответы

Ответ 1

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

Ну, люди, которые действительно любят Ненавязчивый JavaScript могут сказать, что это плохо. Угловые (и те, у кого есть фон flex) видят значение в более декларативном подходе.

"Angular строится вокруг убеждения, что декларативный код лучше, чем необходимо, когда речь идет о создании пользовательских интерфейсов и компонентов программного обеспечения для сборки вместе... В декларативном описании того, как пользовательский интерфейс должен измениться по мере изменения состояния приложения, вы освобождаетесь от низкоуровневых задач манипулирования DOM - Обзор doc

См. также Не используются ли атрибуты атрибутов данных в Bootstrap, Angular.js и Ember.js с принципами ненавязчивого Javascript?

что мне делать с другими событиями DOM?

Напишите свои собственные директивы для их прослушивания (или найдите тот, который еще кто-то написал). Angular дает вам возможность расширять то, что может сделать браузер, написав собственные директивы.

Обновить: в комментариях ниже, Тим Стюарт упоминает AngularUI ui-event, который позволяет вам связывать обратный вызов любого события, не поддерживаемого Angular.

Ответ 2

По своей природе Angular требует элементов в разметке для правильной работы. Кроме того, эти элементы должны быть "скомпилированы" каждый раз, когда они меняются, по большей части. Таким образом, это уже несколько "навязчиво", независимо от JavaScript. Вы не можете просто заменить разметку и все, что вам нужно, с помощью jQuery.

Строго говоря, ненавязчивый JavaScript:  1. разделяет структуру и поведение, чтобы упростить очистку кода и script  2. Упреждает несовместимость браузера  3. работает с чистым семантическим слоем HTML (Википедия)

Это не Angular, конечно. Чтобы добиться двухсторонней привязки ко всему, они решили создать пользовательские точки привязки в DOM, в отличие от использования имени класса или идентификатора, как это сделал бы jQuery. (Несколько нестандартный подход, но он, очевидно, работает.)

Но реальный способ подумать об этом: в основном каждый контролируемый раздел вашей разметки на самом деле не является прямым текстом HTML. Теперь это действительно больше шаблона, и поэтому требует взаимодействия с движком, который готовит его для рендеринга. Таким образом, традиционные правила ненавязчивости действительно не применяются... (FWIW, я большой поклонник/пользователь функции jQuery.on(), чтобы автоматически связывать элементы с событиями, когда элемент добавляется на страницу. Очень чистый и гибкий, IMHO, и я бы хотел, чтобы в Angular был аналогичный механизм. Мне нравится добавлять класс к элементам в нескольких местах на странице, которые автоматически запускают один и тот же обработчик событий. это хорошо, но я отвлекаюсь...)

Для меня большая проблема - это прогрессивный дизайн. Работает ли веб-страница без включенного JavaScript? Кто-нибудь действительно заботится об этом? Хммм...