Как исправить неопределенный результат в массиве параметров $ scope select?

Question

Я использую AngularJS и пытаюсь настроить поле выбора dropbox с параметрами, которые содержатся в массиве и добавлены конечным пользователем через поле ввода.У меня есть $ scope, успешно добавляемый в массив, но в выпадающем списке просто отображается «undefined» для всех опций.

Я искал похожие ответы, но ни один из них не содержит конкретного определения моей ошибки илииспользуя Angular 2+, который не помогает.

<select class="form-control" id="maidOfHonor" ng-model="name"
        ng-options="names.value as names.value for name in names">
</select>

$scope.names = [
    {
        name: "Position Not Filled",
        value: "Position Not Filled"
    }
];
$scope.addName = function() {
    $scope.names.push({ name: this.party.addName, value: this.party.addName });
    console.log($scope.names);
}

В идеале мне бы хотелось, чтобы любое «имя», добавляемое через функцию $ scope.addName (), было добавлено в выпадающий список.поле в качестве значения или имени, вместо undefined, конечно.

Answer 1

Мне кажется, что ваша проблема в синтаксисе ng-options.

Вместо:

ng-options="names.value as names.value for name in names"

Попробуйте

ng-options="name.value as name.name for name in names"

name.value - это значение, которое нужно получить или установить на ng-model.

name.name - это значение, отображаемое в тексте опции.

Обратите внимание, что указанные переменные начинаются с name, а не names, как в исходном коде.

Answer 2

вы можете попробовать ng-repeat, что сравнительно проще, чем ng-options

, вот рабочая скрипка