2016-01-26 2 views
0

Я пытаюсь создать директиву для Angular, которая помещает ярлык и выбирает все необходимые классы. Моя директива код выглядит следующим образом:Angular ngOptions добавочная строка: значение

return { 
     restrict: 'E', 
     scope: { 
      text: '=', 
      model: '=', 
      options: '=' 
     }, 
     template: "<div class='form-group'><label class='control-label'>{{text}}</label><select class='form-control' ng-model='model' ng-options='option.env as option.name for option in options'></select></div>" 

И я называю это использовать это:

<select-input text="'Environment'" options="environments" model="request.Environment"></select-input> 

В мой контроллер, среда определяется как таковую:

$scope.environments = [ 
     { name: 'PROD', env: 'prod' }, 
     { name: 'N', env: 'n0' }, 
     { name: 'N1', env:'n1' }, 
     { name: 'N0', env: 'n2' }, 
    ]; 

Однако, когда угловые преобразования директива к HTML, она приводит к

<select class="form-control ng-pristine ng-untouched ng-valid" ng-model="model" ng-options="option.env as option.name for option in options"><option label="PROD" value="string:prod">PROD</option> 
<option label="N" value="string:n0">N</option> 
<option label="N1" value="string:n1">N1</option> 
<option label="N0" value="string:n2" selected="selected">N0</option> 
</select> 

Я смущен, почему строка: есть ли атрибут value.

ответ

0

Вам не нужно беспокоиться о том, что атрибут value есть, так как он используется внутри.

Имейте в виду, что ng-options может быть выполнен с возможностью передавать различные типы значений в модели ... строка, объект, массив, номер и т.д.

Так инспектирование значение вы это ясно, что значение, которое вы typeof сконфигурированный для будет строка, и модель будет назначена "prod", если она выбрана.

Другое дело, иметь в виду, обратная связь, которая не отображается, когда угловая должен установить существующее значение модели на выбор во время рендеринга

Чтобы быть честным, я никогда не видел этот протокол ценностей, вы указываете. Он выглядит полезным для отладки, когда вы получите неправильный синтаксис ng-options. Я предполагаю, что это функция, которая была добавлена ​​в более поздних версиях угловых ... но я мог ошибаться, и только потому, что мне не приходилось копаться в dom на уровне метки опций некоторое время

0

Основано на ответ charliefl, я изменил источник опций объекта

$scope.environments = { 
     prod: 'PROD', 
     n0: 'N', 
     n1: 'N1', 
     n2: 'N2' 
    }; 

И модифицированное предложение нг-опции для key as value for (key,value) in options. Согласно документации, это предложение select, а значение select и options будет именем свойства, которое в этом случае является prod, n0 и т. Д., Которые соответствуют значению значения среды модели.

2

след по 'собственности'.

Как это:

<select ..... ng-options="option.env as option.name for option in options track by option.env"