Angularjs ng-options с массивом пары ключей

Question

Angularjs ng-options с массивом пары ключей

0

У меня меньше массива. Я пытаюсь использовать различные ng-параметры, но не использовать. Как визуализировать в раскрывающемся списке, используя опции Angularjs ng?

getLanguages: [0: Object: Key: "en" Значение: "English", 1: Object: Key: "fr" Значение: "France"]

<select ng-options="language.Object.Value for language in getLanguages track by language.Object.Value"/>

<select data-ng-model="vm.model">
    <option data-ng-repeat="language in getLanguages" value="{{language.Object.Key}}">{{language.Object.Value}}</option>
</select>

Я получил ответ:

<select class="form-control" data-ng-model="vm.model" >
    <option data-ng-repeat="language in vm.getLanguages()" value="{{language.Key}}">{{language.Value}}</option>
</select>

user3194721 28 дек. 2015, в 22:23

Источник

3

Разместите реальный код JavaScript. [Object: Key:"en" Value:"English", Object: Key:"fr" Value:"France"] не является JavaScript. Также выложите все соответствующие коды. Мы не знаем, что на самом деле делает vm.getLanguages ().
JB Nizet 28 дек. 2015, в 21:33

Теги:

angularjs

3 ответа

1

Попробуйте ng-options = "language.Object.Key as language.Object.Value for language in getLanguages()"

David Meza 28 дек. 2015, в 20:05

0

Это не дает ответа на вопрос. Чтобы критиковать или запросить разъяснения у автора, оставьте комментарий под своим постом. - Из обзора
konqi 28 дек. 2015, в 23:55
0

@konqi на самом деле, я считаю, что это дает ответ на вопрос, хотя он может использовать немного больше информации, чем просто одна строка кода.
Claies 29 дек. 2015, в 01:37
0

@Клиес, я так не думаю. Даже если код решает проблему, «попробуйте следующее» не является ответом, потому что это запрос на тест / дополнительную информацию / разъяснения. Для этого должен быть комментарий. Если такой комментарий приведет к решению, из него можно будет получить ответ. Чтобы квалифицироваться как ответ, сообщение должно, по крайней мере, содержать краткое объяснение того, что не так и почему данное решение будет работать. Принятый ответ обеспечивает все, что этот пост отсутствует. Возможно, пост мог бы быть улучшен до ответа, но его не было в очереди на обзор без причины.
konqi 29 дек. 2015, в 09:33

Показать ещё 1 комментарий

0

angular.module('app', []).controller("controllername", ["$scope", function($scope) {
    $scope.getLanguages = [
        {"en":"English"},
        {"fr":"French"}
    ];

    $scope.getKey = function(getLanguages) {
        return Object.keys(getLanguages)[0];
    }
}]);

user5471213 28 дек. 2015, в 19:01

Ещё вопросы

Разместите реальный код JavaScript. [Object: Key:"en" Value:"English", Object: Key:"fr" Value:"France"] не является JavaScript. Также выложите все соответствующие коды. Мы не знаем, что на самом деле делает vm.getLanguages ().
Это не дает ответа на вопрос. Чтобы критиковать или запросить разъяснения у автора, оставьте комментарий под своим постом. - Из обзора
@konqi на самом деле, я считаю, что это дает ответ на вопрос, хотя он может использовать немного больше информации, чем просто одна строка кода.
@Клиес, я так не думаю. Даже если код решает проблему, «попробуйте следующее» не является ответом, потому что это запрос на тест / дополнительную информацию / разъяснения. Для этого должен быть комментарий. Если такой комментарий приведет к решению, из него можно будет получить ответ. Чтобы квалифицироваться как ответ, сообщение должно, по крайней мере, содержать краткое объяснение того, что не так и почему данное решение будет работать. Принятый ответ обеспечивает все, что этот пост отсутствует. Возможно, пост мог бы быть улучшен до ответа, но его не было в очереди на обзор без причины.

Roddy of the Frozen Peas · Accepted Answer · 2015-12-28T21-18-00.000Z

На самом деле ответ представляет собой комбинацию ответов Дэвида и Старка выше.

Сначала вам нужно убедиться, что ваш контроллер правильно возвращает языки, как указал Старк в своем ответе.

Например, он должен включать что-то вроде:

$scope.languages = [
  { key : "en",
    value : "English" },
  { key : "fr",
    value : "French" }];

Затем вы можете заполнить свои параметры <select>, используя эти языки. Как отметил Дэвид, правильный синтаксис будет похож на следующий:

<select ng-model="model.language"
        ng-options="language.key as language.value for language in languages">

Этот синтаксис говорит "показать" значение "в раскрывающемся списке и сопоставить его с" ключом "для каждого" языка "в коллекции, возвращаемой переменной" languages "в области". Таким образом, в раскрывающемся списке будут отображаться "английский", "французский" и т.д., И когда вы выберете один, он установит значение модели "en", "fr" и т.д.

Вот рабочий Plunkr, показывающий выше в действии.