Блог

Главная - Вопросы по программированию - Использование угловых директив для больших представлений

Использование угловых директив для больших представлений

#angularjs

#angularjs

Вопрос:

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

Примером может служить большая форма, созданная как директива, и большая функция ссылки, размещенная на ней. Не очень проверяемый, и он используется только один раз во всем приложении.

Они хорошо разделяют код, в результате чего вы получаете такой код

 <h1>example Header</h1>

<custom-form form-data="somemodel"></cutom-form>

<p>Lots of other stuff here</p>

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

Ответ №1:

В принципе, я буду реализовывать директиву лишь в нескольких случаях, и это также правила, которых я пытаюсь придерживаться

  1. общие повторно используемые компоненты, которые я могу использовать в любом месте проекта (например, директива ввода времени с дополнительным выпадающим меню позволяет выбирать единицы измерения времени, такие как секунда / минута / час / день)
  2. Расширяйте или исправляйте стороннюю директиву

В большинстве случаев следует использовать структуру AngularJS MVC, чтобы в полной мере использовать ее преимущества.

Комментарии:

1. Если у вас есть экран, состоящий из нескольких разделов, вы бы тогда использовали controller view? Будет ли это использовать ngInclude?

2. В этом случае, да, использование ngInclude было бы отличным способом модуляции содержимого вашего просмотра страницы, но вам может потребоваться соблюдать осторожность, чтобы ngIncude извлекал шаблон асинхронно, что, вероятно, приведет к неожиданному поведению, если вы попытаетесь манипулировать ngIncluded DOM. Мы используем ngInclude для верхнего, нижнего колонтитула, контейнера и меню навигации на нашей индексной странице, однако мы столкнулись с проблемой использования angular-loading-bar внутри ngInclude см. github.com/chieffancypants/angular-loading-bar/issues/217 .

3. Интересно, я не видел, чтобы ngInclude так часто использовался в проектах, в которых я участвовал, но это звучит как аккуратный способ и, с положительной стороны, более тестируемый код директивы, а точнее, большая директива с большим количеством кода