Явное Контроль порядка нг-модели объектов

Скажем, у вас есть несколько входов, как это:Явное Контроль порядка нг-модели объектов

<input type="text" ng-model="user.name"> 
<input type="text" ng-model="user.phone"> 
<input type="text" ng-model="user.email">

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

Так, например:

{{user}}

, как правило, выводятся в случайном порядке, как это:

{ 
phone: '8888888888', 
email: '[email protected]', 
name: 'persons name' 
}

Мой вопрос, как я могу точно контролировать порядок элементов внутри из объект? Что-то вроде этого будет работать идеально: <input type="text" ng-model="user.name" model-position="1">

источник

2016-10-06 Jordash

Объекты javascript не имеют порядка. Что вам нужно сделать, это требует порядка? – charlietfl

Это не совсем так. Согласно спецификации, ключи объектов не имеют порядка, но практически во всех реализациях JS порядок ключей объектов совпадает с порядком, в котором они были добавлены. –

Вы можете объявить объект перед его использованием. Таким образом, javascript сохранит исходный порядок.

// controller code 
$scope.user = { 
    name: '' 
    phone: '', 
    email: '' 
};

Но если у вас есть динамически сгенерированный объект, вы должны восстановить его с помощью нужного вам порядка.

источник

2016-10-06 17:45:18

Это должно сработать. Или просто используйте 'ng-init =" user = user || {name: null, phone: null, email: null} "где-то в родительском поле' 'полей. – bhantol

@bhantol, который не является тем, что ng-init для документов. Не перемещайте функциональность контроллера на вид – charlietfl

Вы правы 'ng-init' могут быть злоупотреблены контроллерами для этого лучше. – bhantol

Ваш лучший выбор, чтобы гарантировать заказ для ключей и значений объектов - это указать его сами. В общем, лучше всего сделать, чтобы преобразовать ваш объект в массив пар ключ/значение и использовать фильтр, чтобы обеспечить его отображение таким образом. Как так:

angular.filter('specialFilter', function(object) { 
    return Object.keys(object).sort().map(key => ({key: key, value: object[key] })); 
})

, а затем вы можете использовать его в качестве шаблона, как это:

{{user | special}}

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

источник

2016-10-06 17:49:36

Вы не можете контролировать заказ здесь. Просто обеспечивает определенный согласованный порядок. – bhantol

Вы можете управлять им любым способом, который вы хотите. Вам просто нужно настроить фильтр соответствующим образом. И ОП спрашивал о последовательности, а не о полном контроле. –

Явное Контроль порядка нг-модели объектов

ответ

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