В нашем приложении мы много работаем с сетками. У нас есть уникальный дизайн для ситуаций, когда определенные ячейки считаются «пустыми». Наивный подход состоит в том, чтобы повторять себя в каждом случае использования и делать что-то вроде этого:

Но мы лучше этого. Мы можем создать структурную директиву, которая инкапсулирует этот повторяющийся код:

Сначала мы создаем компонент для нашего пустого представления состояния. Затем мы создаем структурную директиву, которая принимает value и необязательный predicate, который по умолчанию равен isNil (функция, которая проверяет, является ли value undefined или null)

Наконец, основываясь на результирующем значении функции predicate, мы визуализируем правильное представление. Теперь мы можем использовать это так:

Намного чище 😃

🚀 На случай, если вы это пропустили

Вот несколько моих проектов с открытым исходным кодом:

  • Акита: государственное управление, специально разработанное для JS-приложений
  • Spectator: мощный инструмент для упрощения ваших угловых тестов
  • Transloco: библиотека интернационализации Angular
  • error-tailer - Бесшовные формы ошибок для приложений Angular
  • Менеджер форм: основа правильного управления формами в Angular
  • Кешью: гибкая и простая библиотека, которая кэширует HTTP-запросы.
  • Error Tailor - бесшовные формы ошибок для приложений Angular.

И еще многие!

Подпишитесь на меня в Medium или Twitter, чтобы узнать больше об Angular, Akita и JS!