Как сохранить выбранным первый вариант в oi-select angularjs

Планкер, чтобы попробовать Я использую библиотеку oi-select для выбора нескольких вариантов, я хочу первое значение из данных должно быть выбрано по умолчанию, как только данные станут доступны. HTML-код

<oi-select multiple ng-init="selectedNewRelease=releaseList[0]" 
oi-options="item.releaseId for item in releaseList" ng-model="selectedNewRelease" 
placeholder="Select Releases" 
oi-select-options="{dropdownFilter: 'myDropdownFilter'}" id="selectedReleases" 
ng-change="onReleaseChange();toggleCol();"></oi-select>

Я попытался с ng-init, назначив, как показано ниже:

 $scope.selectedNewRelease=$scope.releaseList[0];

Это действительно работает, но как только я выбираю один или несколько параметров, он удаляет выбранный по умолчанию параметр. Любая идея, любая ссылка, пожалуйста. ссылка для oi-select


person Sudarshan Kalebere    schedule 19.04.2017    source источник


Ответы (2)


при установке значения по умолчанию для oi-select(несколько) с объектом, а не с массивом, выбор нового элемента приведет к перезаписи исходного значения. Поэтому вы должны инициализировать его с помощью Array. Что-то вроде этого:

ng-init="selectedNewRelease=[releaseList[0]]

обратитесь к этому plunker.


ОБНОВЛЕНИЕ:

oi-select использовал ngModel для достижения two-way-databinding, и поскольку angular не будет вызывать изменение, если instance массива не изменен (означает, что ng-change не сработает без изменения экземпляра).

Итак, после добавления новых элементов вы должны сделать что-то вроде этого:

$scope.selectedNewRelease = $scope.selectedNewRelease.slice(); // create new instance for the array.
person Pengyy    schedule 19.04.2017
comment
да, я попытался поместить первую запись в $scope.selectedNewReleases.push(releaseList[0]), но она не показывает выбранное, когда я выбираю второе значение, оно показывает первое, а затем второе. - person Sudarshan Kalebere; 19.04.2017
comment
@Sudarshan, когда ты нажал первый элемент? если в асинхронных обратных вызовах, возможно, вам следует рассмотреть вызов $scope.$apply. - person Pengyy; 19.04.2017
comment
plnkr.co/edit/mwNkSCBCrz3zXXbdJK8o?p=preview это моя скрипка в реальном времени. Я попробовал scope.apply тоже проверить здесь - person Sudarshan Kalebere; 19.04.2017
comment
plnkr.co/edit/63IL5lZ7hAoNqvtAlqWk?p=preview это работает при выборе первого варианта, но когда я выбираю второй вариант, первый вариант исчезает. - person Sudarshan Kalebere; 19.04.2017
comment
@Sudarshan В вашем первом плунжере вы не получите реальных данных для query, которые вернутся как promise. И второй плунжер, пожалуйста, удалите ng-init. - person Pengyy; 19.04.2017
comment
да, в plunker он работает, спасибо за это, но в моем проекте он вообще не работает. :-( - person Sudarshan Kalebere; 19.04.2017
comment
@Sudarshan Разница между этими двумя заключается в том, как вы работаете с данными. Возможно, вам следует опубликовать код об этом или, может быть, опубликовать новый вопрос. - person Pengyy; 19.04.2017
comment
оба случая в порядке, и оба такие же, как я, и оба работают в plunker, но в моем проекте я не знаю, что происходит не так, я также пытаюсь нажать, а также ng-init также один за другим\ - person Sudarshan Kalebere; 19.04.2017
comment
@Сударшан извини за это. Дайте мне знать, если что-то может помочь. - person Pengyy; 19.04.2017
comment
У меня есть три подобных раскрывающихся списка, поэтому при выборе второго я делаю вызов для получения данных, а после данных мне нужен этот предварительный выбор. Да, спасибо, Пенги, в любом случае я приму ваш ответ. Я должен видеть, что я делаю неправильно :-( - person Sudarshan Kalebere; 19.04.2017
comment
@Sudarshan Я обновил ответ некоторыми новыми вещами, а также плунжером. Сходи проверь, думаю поможет. - person Pengyy; 19.04.2017
comment
отличное продуманное использование фрагмента, новый экземпляр будет иметь в виду в следующий раз. - person Sudarshan Kalebere; 19.04.2017

попробуй это

ng-init="selectedNewRelease=releaseList[0]" вместо ng-init="releaseList[0]"

Редактировать:

Или удалите ng-init="selectedNewRelease=releaseList[0]" в oi-select и назначьте значение в контроллере после загрузки данных releaseList

как

function controller($scope)
{
Loaddropdown()
{
$http().success(function(data){
$scope.releaseList = data;
$scope.selectedNewRelease =$scope.releaseList[0]//or $scope.selectedNewRelease=$scope.releaseList[0].Id// which id means what's your value  
})
}
}
person Ramesh Rajendran    schedule 19.04.2017
comment
Да, я пробовал, извините по ошибке, я забыл отредактировать правильно, но не повезло, похоже, что oi-select не будет поддерживать только ng-init - person Sudarshan Kalebere; 19.04.2017
comment
Я тоже пробовал это, я упомянул в своем вопросе, пожалуйста, посмотрите, это работает, но когда я выбираю любую другую опцию, выбранное значение исчезает. Пожалуйста, прочитайте мой вопрос, также я не могу назначить его с моего контроллера, потому что мне нужно, чтобы selectedNewReleases выполнял итерацию, чтобы увидеть, сколько вариантов выбрано. если я назначу, то его длина всегда будет равна 0 при каждом вызове. - person Sudarshan Kalebere; 19.04.2017
comment
`это работает, но когда я выбираю любую другую опцию, выбранное значение исчезает` Это функция раскрывающегося списка. Правильно? - person Ramesh Rajendran; 19.04.2017
comment
Это oi-select, который имеет возможность множественного выбора, пожалуйста, обратитесь по ссылке для oi-select, которую я дал, например, см. это plnkr.co/edit/0YRiCeEjYRW6HL6rrCfj?p=preview - person Sudarshan Kalebere; 19.04.2017
comment
Пожалуйста, добавьте атрибут multiple в файл oi-select. Проверьте это tamtakoe.github.io/oi.select/#/select/# несколько - person Ramesh Rajendran; 19.04.2017
comment
Это моя скрипка в реальном времени, попробуйте здесь plnkr.co/edit/mwNkSCBCrz3zXXbdJK8o?p=preview - person Sudarshan Kalebere; 19.04.2017