Повторители, переключатели и разделы, о мой

Question

Я пытаюсь сделать форм-дизайнер / строитель с webapi и angularjs.Я передаю ряд полей, учитывая идентификатор формы.Один из пар ключевых ценностей, которые передаются, - это то, в каком разделе должно быть поле. Разделы по существу являются Div .well, что с H5 {раздел} в качестве заголовка раздела.Проблема, которую я хочу иметь 2-3 раздела, содержащие несколько полей, но я не могу понять правильный путь, построить свой частичный. Вот ссылка на jsfiddle, на котором я работал над

<link href="//netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css" rel="stylesheet">
<div ng-app="myApp">
<div ng-controller="FormCtrl">
    <div class="well" style='overflow: hidden'>
        <div ng-repeat="formfield in form.FormsFields | filter:q">
            <div ng-switch on="formfield.Field.fieldType">
                <div ng-switch-when="Txt" class="span{{formfield.spanSize}}" style="margin-left: 5px; ">
                    <label for="" class="label label-info">{{formfield.Field.label}}</label>
                    <input type="text" class="input-block-level" section="{{formfield.section}}" name="" id="test">
                </div>
                <div ng-switch-when="Are" style="margin-left: 5px; ">
                    <br>
                    <div>
                        <label for="" class="label label-info">{{formfield.Field.label}}</label>
                        <textarea class="input-block-level" name="" section="{{formfield.section}}" id="test"></textarea>
                    </div>
                </div>
                    <h1 ng-switch-default>Error</h1>

            </div>
        </div>
    </div>
</div>

.

Вот ссылка на jsfiddle i работала над

Answer 1

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

$scope.sections = groupBySection(data);

function groupBySection(data) {
    var grouped = _.groupBy(data.FormsFields, 'section');

    return _.map(grouped, function(val, key){
        return { name: key, fields: val };
    });
};

.

И, конечно, A jsfiddle показывает все это работает .