У меня есть структура данных (пример представлен ниже), где мне нужно итерации по этому набору вопросов и возможность их шаблона в угловом формате. Каждый «вопрос» имеет такую структуру:Рекурсивный или сложный шаблон с угловым 1.x
{
id: 2, // unique id
label: 'some label', // any label
type: 'input', // the type of html element
options: [], // other questions are nested in here (recursive)
children: [] // other questions are nested in here (recursive)
}
Как уже упоминалось выше, тип описывает тип элемента HTML, а разница между options
и children
является то, что множество questions
, которые отображаются в options
являются отображением в той же строке как родительский вопрос, тогда как questions
внутри children
отображаются на одной строке ниже с небольшим количеством левого поля.
Я не достаточно знаком с Angular о том, как вы достигнете этого, учитывая, что базового ng-repeat
здесь не хватит (из того, что я понимаю), и мне любопытно, как можно было бы планировать такие данные состав.
Большое спасибо, за помощь!
Вот структура выборки данных:
[
{
id: 1,
label: 'something',
type: 'text',
options: [
{
id: 2,
label: 'another',
type: 'text',
options: [],
children: []
}
],
children: [
{
id: 83,
label: 'cool',
type: 'input',
options: [],
children: []
},
{
id: 121,
label: 'another cool thing',
type: 'label',
options: [
{
id: 451,
label: 'only a label',
type: '',
options: [],
children: [
{
id: 901,
label: 'a cool info',
type: 'label',
options: [],
children: []
}
]
}
],
children: []
}
]
},
{
id: 27,
label: 'some text',
type: 'label',
options: [
{
id: 541,
label: 'hey there',
type: 'label',
options: [],
children: []
}
],
children: [
{
id: 761,
label: 'hi there',
type: 'checkbox',
options: [],
children: []
},
{
id: 165,
label: 'cool',
type: 'text',
options: [
{
id: 1090,
label: 'neat',
type: 'input',
options: [],
children: [
{
id: 9891,
label: 'tell me',
type: 'textarea',
options: [],
children: []
}
]
}
],
children: []
}
]
}
];
Вам нужно будет использовать вложенные ng-повторы и применить ng-класс в зависимости от типа элемента, который вы зацикливаете, чтобы параметры и дети выглядели иначе, применяя классы css. –
Да, это то, что я изначально имел, однако, он не решает следующих проблем: --------- 1) Вложенные ng-повторы не хуже, чем многие уровни, которые вы пишете. поэтому почему мне было интересно, есть ли другой способ сделать это? ------- 2) ng-класс не учитывает различные типы элементов html. я думал об использовании ng-switch и наличии всех различных там, но есть ли другой способ? – Detuned