AngularJS/Select2 программным образом добавить элемент и выбрать этот элемент не работает

Question

Я новичок в использовании AngularJS и элемента управления select2 (AngularUI) и использую последнюю стабильную версию select2 (3.4.5). Я пытаюсь добавить элемент программным путем через javascript в список, который использует ui-select и выбирает этот элемент. По какой-то причине он обновляет ng-модель, но не отображает элемент из раскрывающегося списка визуально.

Пример здесь: http://plnkr.co/edit/X1flkKxnDHVCgXHnnmE4?p=preview

Как вы видите, при нажатии кнопки «добавить желтый», он добавляет его в выпадающем списке, и устанавливает модель selectedColor быть правильный цвет, однако, он не получает обновлен визуально на <select>. Любая помощь будет большой, спасибо!

Answer 1

Вы должны добавить $scope.$Apply(); после добавления новых элементов в список, чтобы Angular смог отобразить его правильно.

Вы можете увидеть пример здесь: http://plnkr.co/edit/66zQdJl1MvRIcx3qGCkz?p=preview

Answer 2

Маленький хак для решения этой проблемы: http://plnkr.co/edit/Us35mGXkaOGGc3jHGdDf?p=preview

Вы просто скопировать массив, angular.copy().

Есть 2 примера. См. Блок версий. Сначала для строк и второй для объектов.