Компонент AngularJS для формы

У меня есть форма, которая содержит разные поля: ввод, выбор, выбор нескольких кнопок. И мне было интересно, было бы хорошей идеей (и фактически осуществимой) для создания компонента для этой формы, этот компонент будет похож на контейнер, который может содержать все типы полей формы (ввод, выбор, кнопка и т. Д.)).Компонент AngularJS для формы

Я поставил образец кода на plunker, что я хотел бы сделать, это создать компонент для формы, в котором я мог бы добавить сколько еще компонентов хочу (кнопка, вход и т. Д.).

<!DOCTYPE html> 
<html ng-app="MyApp"> 

<head> 
    <link data-require="[email protected]" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" /> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.6/angular.min.js"></script> 
    <script src="script.js"></script> 
    <script src="myInput.js"></script> 
    <script src="myButton.js"></script> 
</head> 

<body ng-controller="MyCtrl"> 
    <div class="container"> 
    <h2>My form</h2> 
    <form role="form"> 
     <my-input label="Firstname"></my-input> 
     <my-input label="Lastname"></my-input> 
     <my-button label="Submit"></my-button> 
    </form> 
    </div> 
</body> 

</html>

источник

2016-06-16 Mouss

очевидно компоненты являются идеальным решением для таких случаев, особенно если у них есть автономная логика – elasticrash

Если вы планируете повторно использовать форму в других частях своего кода, я бы сказал, что было бы неплохо создать ее в качестве компонента.

В противном случае это всего лишь вопрос предпочтения. Иногда бывает приятно разделить большие части кода на разные файлы.

Редактировать: Plunker Пример https://plnkr.co/edit/kyt9Q6L01r06dJXLDQZH?p=preview

<body ng-controller="MyCtrl"> 
    <div class="container"> 
    <my-form></my-form> 
    </div> 
</body>

Изменить 2: Обновленный Plunker с примером передачи объектов как атрибут в виде

<body ng-controller="MyCtrl"> 
    <div class="container"> 
    <my-form inputlabels="inputs1"></my-form> 
    <my-form inputlabels="inputs2"></my-form> 
    </div> 
</body>

источник

2016-06-16 14:19:12

Thanx Итак, вы подтверждаете, что возможно создать компонент формы, который будет похож на контейнер компонента? – Mouss

@ user3414662 Да, если вы планируете повторно использовать форму или если вы не хотите смешивать форму с другим кодом. Это хороший подход, если вы получили очень большую форму с множеством функций и логики, связанных с ней, тогда вам будет легче поддерживать в конечном итоге, если у нее есть свои собственные файлы (то есть, будучи использованными как компонент). –

У вас есть код для обмена, потому что я не знаю, как сделать контейнерный компонент. – Mouss

Если вы отметите «Да» на эти два вопроса, то вы должны создать компонент:

ли это многоразовые?
Имеет ли форму уникальную логику?

источник

2016-06-16 14:19:05 AranS

Что вы подразумеваете под уникальной логикой? – Mouss

Компонент AngularJS для формы

ответ

Смежные вопросы