Инициализация ngModel с данными — AngularJS Bootstrap bs-select

Я поддерживаю сайт, который позволяет пользователям создавать своего рода профиль, который позволит им транслировать действия в ленту. Я реализую ng-grid для отслеживания всех созданных профилей и создал две кнопки, которые позволяют пользователям создавать/редактировать эти профили. Моя единственная проблема сейчас заключается в том, что когда пользователи выбирают строку в сетке и пытаются отредактировать эту конкретную строку, раскрывающееся меню не заполняется автоматически данными из ngModel.

Это часть формы, с которой у меня проблемы:

<select ng-model="source.canSendTo" ng-options="value.name for value in sourceCanSendTo" data-style="btn" bs-select></select>

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

$scope.sourceCanSendTo = [ {"id":"abc", "name": "ABC"}, {"id":bcd", "name": "BCD"} ... ];

При выборе строки я просто устанавливаю source = выбранный элемент, и console.logs показывает, что все данные есть. Другие части формы заполняются правильно (в основном s), а console.log($scope.source.canSendTo) показывает, что исходные данные есть, просто выбор по умолчанию пуст... как бы я пытаться предварительно выбрать определенные элементы в раскрывающемся списке, который у меня есть в настоящее время?

Например, если в профиле выбраны «abc», «bcd», как я могу сделать так, чтобы при редактировании этого профиля в раскрывающемся списке отображалось «abc, bcd», а не просто «Ничего не выбрано»?

Редактировать: я ранее ответил на комментарий с вопросом о bs-select, говоря, что он просто контролирует некоторые элементы CSS раскрывающегося списка - кажется, что это совершенно неверно после быстрого поиска в Google, когда все остальное привело к тупикам. Кто-нибудь знает, как правильно инициализировать модель данными, чтобы, когда я предварительно загружаю свою форму, в раскрывающемся списке «можно отправить» действительно были выбраны выбранные параметры, а не «Ничего не выбрано»? Заранее спасибо за помощь!


angularjs angular-bootstrap
person athoi    schedule 21.07.2014    source источник
comment
У вас есть source.canSendTo и sourceCanSendTo один раз с точкой и один раз без, это сделано намеренно или опечатка?   -  person Leonard Brünings    schedule 22.07.2014
comment
Это сделано намеренно. Мне действительно нужно переименовать некоторые переменные, чтобы это было менее запутанным, этот проект сначала был довольно запутанным для меня... SourceCanSendTo содержит значения, которые может выбрать пользователь, и выбранные значения сохраняются в $scope. источник.canSendTo. Я помещаю объект $scope.source в массив объектов в ngGrid, используемый для управления всеми профилями. Извините за путаницу :х   -  person athoi    schedule 22.07.2014
comment
Что такое bs-select? Это директива третьей стороны?   -  person runTarm    schedule 22.07.2014
comment
Какова структура данных, которые вы получаете с сервера?   -  person nramirez    schedule 22.07.2014
comment
@nramirez - я получаю данные из выбранной строки ngGrid, где храню все данные. Существует множество других свойств, но для свойства canSendTo $scope.source я возвращаю данные, как показано в моем сообщении (объекты в массиве $scope.sourceCanSendTo привязаны к $scope.source.canSendTo, например, если выбрано «ABC», объект {id:abc, name:ABC} помещается в $scope.source.canSendTo)   -  person athoi    schedule 22.07.2014

Ответы (3)


arrow_upward
2
arrow_downward

Поскольку вы привязываете source.canSendTo к имени (value.name) sourceCanSendTo, вам просто нужно изначально иметь структуру, связывающую имена, которые были сохранены, примерно так:

source.canSendTo = ['abc', 'bcd']; //And all the selected values

Поэтому вам нужно создать свойство source.canSendTo для этой структуры.

PS: Если вы покажете, как вы приносите свои данные с сервера, я могу помочь вам создать свойство source.canSendTo.

person nramirez    schedule 22.07.2014
comment
Спасибо за ваш ответ! При выборе строки в ngGrid я устанавливаю $scope.source = selectedRow, поэтому $scope.source.canSendTo содержит все значения, необходимые на данный момент. Нужно ли мне на самом деле вставлять объекты один за другим? (Я пытаюсь связать объекты и позволяю пользователям выбирать эти объекты на основе атрибута имени объекта) - person athoi; 22.07.2014
comment
да, вам нужно передать только имя в свойство source.CanSendTo, вы можете сделать это с помощью for. Вам лучше указать идентификатор вместо имен, вы можете изменить директиву ng-options, чтобы отображались имена, но привязать идентификатор, например, ng-options=value.Id как value.name для значения в sourceCanSendTo. - person nramirez; 22.07.2014
comment
@athoi, тогда вы можете сохранить идентификатор и изначально преобразовать массив идентификаторов в свой source.canSendTo, например source.canSendTo = ['abc, 'bcd'] - person nramirez; 22.07.2014
comment
Спасибо за вашу помощь! Ваш пост очень помог мне, когда я снова просмотрел его во время отладки прошлой ночью! Я бы проголосовал за вас, но у меня 15- репутация.. - person athoi; 24.07.2014

arrow_upward
0
arrow_downward

$scope.canSendTo должен быть инициализирован ссылкой на выбранный параметр.

var initialSelection = 0;
$scope.source = { canSendTo : [ {"id":"abc", "name": "ABC"}, {"id":bcd", "name": "BCD"} ... ] };
$scope.canSendTo = $scope.source.canSendTo[initialSelection];
person Blaskovicz    schedule 22.07.2014

arrow_upward
0
arrow_downward

Наконец-то выяснил, что не так с моим кодом - похоже, что данные, хранящиеся в модели, не были такими же, как в ngOptions, немного поиграл с ngOptions и сумел получить что-то, что работает. Рабочий фрагмент кода:

<select ng-model="sendTo.name" ng-option="value.name as value.name for value in sourceCanSendTo" data-style="btn" multiple bs-select>

(Понял, что переменная, используемая для ngModel, была довольно неоднозначной с точки зрения соглашения об именах, изменил ее)

person athoi    schedule 24.07.2014