Установка значения по умолчанию в раскрывающемся списке выберите Angularjs

У меня есть объект, как показано ниже. Я должен показать это как раскрывающийся список:

var list = [{id:4,name:"abc"},{id:600,name:"def"},{id:200,name:"xyz"}]

В моем контроллере у меня есть переменная, которая несет значение. Это значение решило, какой из трех элементов в массиве будет выбран по умолчанию в раскрывающемся списке:

 $scope.object.setDefault = 600;

Когда я создаю раскрывающийся элемент формы, как показано ниже:

<select ng-model="object.setDefault" ng-options="r.name for r in list">

Я сталкиваюсь с двумя проблемами:

список создается как

<option value="0">abc</option>
<option value="1">def</option>
<option value="2">xyz</option>

вместо

<option value="4">abc</option>
<option value="600">def</option>
<option value="200">xyz</option>

Никакой параметр не будет выбран по умолчанию, даже если у меня есть ng-model="object.setDefault"

Ответ 1

Проблема 1:

Сгенерированный HTML, который вы получаете, является нормальным. По-видимому, это функция Angular, чтобы иметь возможность использовать любой объект в качестве значения для выбора. Angular выполняет сопоставление между значением параметра HTML и значением в ng-модели. Также см. Комментарий Umur в этом вопросе: Как установить свойство value в параметрах AngularJS ng?

Проблема 2:

Убедитесь, что вы используете следующие параметры ng:

<select ng-model="object.item" ng-options="item.id as item.name for item in list" />

И поместите это в свой контроллер, чтобы выбрать значение по умолчанию:

object.item = 4

Ответ 2

Когда вы используете ng-options для заполнения списка выбора, он использует весь объект в качестве выбранного значения, а не только одно значение, которое вы видите в списке выбора. Поэтому в вашем случае вам нужно установить

$scope.object.setDefault = {
    id:600,
    name:"def"
};

или

$scope.object.setDefault = $scope.selectItems[1];

Я также рекомендую просто выводить значение $scope.object.setDefault в вашем шаблоне, чтобы узнать, что я говорю о выборе.

<pre>{{object.setDefault}}</pre>

Ответ 3

В представлении

<select ng-model="boxmodel"><option ng-repeat="lst in list" value="{{lst.id}}">{{lst.name}}</option></select>

JS:

В боковом контроллере

 $scope.boxModel = 600;

Ответ 4

Вы можете сделать это с помощью следующего кода (track by),

<select ng-model="modelName" ng-options="data.name for data in list track by data.id" ></select>

Ответ 5

Это старый вопрос, и вы, возможно, уже получили ответ.

My plnkr объясняет мой подход, чтобы выполнить выбор значения раскрывающегося списка по умолчанию. В принципе, у меня есть служба, которая вернет значения выпадающего списка [жестко закодированные для тестирования]. Я не смог выбрать значение по умолчанию и почти потратил день и, наконец, понял, что должен был установить $scope.proofGroupId = "47"; вместо $scope.proofGroupId = 47; в файле script.js. Это было плохо, и я не заметил, что я устанавливаю целое число 47 вместо строки "47". Я сохранил plnkr, как это было на всякий случай, если кто-то захочет это увидеть. Надеюсь, это поможет кому-то.

Ответ 6

<select ng-init="somethingHere = options[0]" ng-model="somethingHere" ng-options="option.name for option in options"></select>

Это даст вам желаемый результат Dude:) Cheers

Ответ 7

Некоторые из сценариев, object.item не будут загружены или будут undefined.

Используйте ng-init

<select ng-init="object.item=2" ng-model="object.item"
ng-options="item.id as item.name for item in list"

Ответ 8

$scope.item = {
    "id": "3",
    "name": "ALL",
};

$scope.CategoryLst = [
    { id: '1', name: 'MD' },
    { id: '2', name: 'CRNA' },
    { id: '3', name: 'ALL' }];

<select ng-model="item.id" ng-selected="3" ng-options="i.id as i.name for i in CategoryLst"></select>

Ответ 9

мы должны использовать значения привязки пары значений имени в раскрывающемся списке. код для более подробной информации

function myCtrl($scope) {
     $scope.statusTaskList = [
        { name: 'Open', value: '1' },
        { name: 'In Progress', value: '2' },
        { name: 'Complete', value: '3' },
        { name: 'Deleted', value: '4' },
    ];
    $scope.atcStatusTasks = $scope.statusTaskList[0]; // 0 -> Open 
}

<select ng-model="atcStatusTasks" ng-options="s.name for s in statusTaskList"></select>

Ответ 10

Я мог бы помочь вам с html:

<option value="">abc</option>

вместо

<option value="4">abc</option>

чтобы установить значение abc как значение по умолчанию.