Comments 6
Я не спец в реакте но это помоему перебор:
<button pButton type="button" label="{{ 'button_save' | translate: 'COMMON' | ucfirst }}" (click)="doSubmit()"></button>
Можете рассказать за что отвечает каждый атрибут и для чего сделанно так?
А ещё можно посмотреть на код формы которую в итоге получит посетитель сайта? Очень интересно на сколько используются стандартные возможности браузера. Ведь для валидации и отправки данных формы в классическом виде не нужно ни строчки Javascript.
Код явно из Angular.
Все можно решить через <ng-content> внутри компонента и избавиться от label. Плюс, translate пайпу можно упростить через вложенность внутри .json
Вся мощь компонентов ангуляра в статье убивается.
FormBuilder – очень желательно заменить на FormGroup / FormControl + с 14 ангуляром еще и типизированные формы подъехали.
[formControlName]="'name1'" = formControlName="name1"
Семантика – вместо doCancel() желательно onCancel().
Короче, статья – пример плохого кода.
pButton это селектор компонента
type это тип кнопки
label метка с навешанным переводом через пайпы
Вижу плюсы:
1. Ускорение разработки (разработчик копирует куски кода целиком).
2. Унификация. Можно в код вставить, например, заготовки под id или name для каждого элемента и разработчики будут их заполнять. Таким образом все элементы формы будут иметь свой идентификатор, что может быть полезно для тестирования.
Но есть и минусы:
1. Копируя код и переиспользуя стили, потихоньку забываешь основы и работать на проектах без такой системы может стать неудобным )
... а вообще хорошо бы всё это дело максимально засунуть в систему связанных библиотек которые можно было бы при необходимости подключать к своим проектам. Тогда вместо копирования и модифицирования блоков кода будет вставка и настройка "под себя" готовых элементов из библиотек.
Дизайн-система как инструмент для разработчика