Что-нибудь вроде ссылок на шаблоны в AngularJS?

Я пытаюсь создать форму, макет которой полностью управляется данными.

Пример источника данных:

{
    title : "Form Test",
    fields : [{
            name : "FieldA",
            type : "string",
            value : "initial value"
        }, {
            name : "FieldB",
            type : "selection",
            options : ["1", "2", "3"],
            value : "2"
        }, {
            name : "FieldC",
            type : "struct",
            value :
            [{
                    name : "FieldC1",
                    type : "string",
                    value : "initial value"
                }, {
                    name : "FieldC2",
                    type : "string",
                    value : "initial value"
                }
            ]
        }
    ]
}

Я думаю, что я могу использовать ng-repeat и ng-switch для выбора элемента формы в зависимости от типа, но я зацикливаюсь, когда дело доходит до этого рекурсивно, когда я доберусь до 'FieldC'.

<span ng-switch on="field.type">
    <div ng-switch-when="string">STRING: {{field.value}}</div>
    <div ng-switch-when="selection">SELECTION: {{field.value}}</div>
    <div ng-switch-when="struct">STRUCT: ????</div>
    <div ng-switch-default>DEFAULT:{{field.value}}</div>
</span>

По сути, я хочу, чтобы при столкновении с "struct" он рекурсивно применял ng-switch к полям struct? Есть ли способ "ссылаться" на шаблон, чтобы его можно было использовать в нескольких местах на одной странице? По-видимому, поддержка "частичных" шаблонов должна быть скоординирована на стороне сервера через маршруты, которые здесь кажутся излишними. Это то, что мне нужно, чтобы начать копаться в создании моих собственных директив?

EDIT Я просто наткнулся на этот, который выглядит так, будто у него есть достойная возможность делать то, что я хочу (I пока еще не проверили его правильно), то есть в правильном направлении?

Ответ 1

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

Способ обработки рекурсии - рассматривать каждый уровень, включая верхний уровень, как другую структуру. Я построил версию здесь: http://jsfiddle.net/U5Kyp/9/

Убедитесь, что вы прочитали директиву в документах, чтобы понять, что происходит: http://docs.angularjs.org/guide/directive

Ответ 2

Вот обновление принятого ответа для angular.js 1.0.1 В стабильной версии было несколько несовместимых изменений:

  • ng-app теперь требуется директива Изменен синтаксис и семантика области

http://jsfiddle.net/9qAfM/1/

Ответ 3

По-моему, это плохой результат внутреннего эффекта платформы. Цитируя википедию: "тенденция архитекторов программного обеспечения создавать систему, настраиваемую так, чтобы стать репликой, а часто и плохими репликами платформы разработки программного обеспечения, которую они используют".

У AngularJS уже есть мощный механизм для перемещения дерева объектов и создания из него стека областей и контроллеров. Вы можете утверждать, что это точно, что AngularJS IS.

Если вы вынуждены создавать формы из такого отвратительного JSON, я думаю, что самый простой способ - превратить их в HTML (с помощью простого языка шаблона любого типа, стороне сервера или клиента), а затем используя $компилировать сервис, чтобы превратить их в приложение с угловым выражением.