Как добавить пользовательский параметр в вывод ng-options?

Question

Я создал выбор в таблице, которая получает какой-то адрес электронной почты из списка. Вот код:

<td>
    <select ng-init="selectedEmail = selectedEmail ? selectedEmail : emails[0]" class="form-control" ng-model="selectedEmail" ng-options="item as item.dest for item in emails"></select>
</td>

Я бы добавил дополнительную опцию, которая была бы индивидуальной для конечных пользователей. Если я добавлю <option> в <select>, он будет перезаписан Angular ng-options

<td>
    <select ng-init="selectedEmail = selectedEmail ? selectedEmail : emails[0]" class="form-control" ng-model="selectedEmail" ng-options="item as item.dest for item in emails">
        <option value="custom">Custom</option>
    </select>
</td>

Как я могу добавить пользовательский параметр?

Моя цель состоит в том, чтобы добавить «пользовательский» выбор для пользователей: если они выбирают эту опцию, они могут записать свой собственный выбор, собственный текст.

javascript angularjs select option ng-options

3

smartmouse 17 Дек 2015 в 17:00

Answer 1

Есть несколько способов решить эту проблему. Если вы хотите продолжить использовать ng-options, вы можете использовать функцию.

HTML

<td>
    <select 
        ng-init="selectedEmail = selectedEmail ? selectedEmail : emails[0]"
        class="form-control" 
        ng-model="selectedEmail" 
        ng-options="item as item.dest for item in BuildList()"></select>
</td>

<input type="text" placeholder="Enter Custom Option" ng-model="customText" />

Функция контроллера для BuildList

$scope.BuildList = function() {

    if(!$scope.customText) {
       return $scope.emails;
    }
    var newList = angular.copy($scope.emails);
    newList.push({someobjectbuildUsingCustom});

    return newList ;
}

1

Malkus 17 Дек 2015 в 14:44

Answer 2

Вы можете сделать согласно ниже:

<div ng-controller="TestController">
  {{sel}}
  <select ng-model="sel" ng-options="d.value as d.label for d in data">
    <option value="">any</option>
  </select>
</div>

См. также эту скрипку

2

Jax 17 Дек 2015 в 14:27

Answer 3

Вы можете использовать этот синтаксис:

<select>
    <option ng-repeat="(key, value) in emails" value="{{key}}">{{value}}</option>
    <option ... custom option ...>...</option>
</select>

-2

Digix 17 Дек 2015 в 14:13

Как добавить пользовательский параметр в вывод ng-options?

3 ответа

Похожие вопросы

Связанные вопросы

Новые вопросы

javascript