Почему angularjs включает пустую опцию в директиву выбора с использованием с включением и заменой

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

Это пример того, как я хочу, чтобы это выглядело:

<select>
  <option value="">Search all cars</option>
  <option value="aud">Audi</option>
  <option value="bmw">BMW</option>
  <option value="maz">Mazda</option>
</select>

Важно, чтобы значение «Искать все машины» было пустым.

Но даже несмотря на то, что я добавил пустой элемент в выборку (ref другие сообщения SO), это все еще дает мне нежелательный вариант:

<option value="?" selected="selected"></option>

Вот пример проблемы/ошибки с использованием директивы Angular с включением и заменой .

У кого-нибудь есть предложение, как это решить?

Я также добавил задачу в команду angular здесь.

ИЗМЕНИТЬ:

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

EDIT2: команда Angular подтверждает, что это ошибка. «Похоже, основная причина в том, что если после первоначальной настройки добавить неизвестную опцию, она не заменит сгенерированную неизвестную опцию» — lgalfaso.


person Jan-Terje Sørensen    schedule 16.04.2014    source источник
comment
Я думаю, это потому, что вы включаете параметр по умолчанию (пустой) в выбор. Судя по тому, как работает transclude, я предполагаю, что окончательная директива select просто не распознает внедренную опцию по умолчанию и, таким образом, создает свою собственную, потому что модель не соответствует ни одному значению в заданных опциях.   -  person Yoshi    schedule 16.04.2014
comment
@Yoshi - согласен! Вы знаете, является ли это угловой ошибкой или функцией?   -  person Jan-Terje Sørensen    schedule 16.04.2014
comment
Я бы сказал, как это работает (особенно как компилируются директивы). Из-за этого я думаю, вам придется написать свой собственный метод компиляции, чтобы внедрить параметр по умолчанию в выбор без использования включения.   -  person Yoshi    schedule 16.04.2014


Ответы (2)


@Yoshi прав, это связано с ngTransclude. Как только вы переместите параметр по умолчанию в саму директиву, проблема исчезнет. Чтобы обойти эту проблему, поскольку вам не так важно значение по умолчанию, вы можете немного изменить директиву и просто импортировать текст для параметра по умолчанию:

app.directive('mySelect', [function () {
  return {
    restrict: 'E',
    replace: true,
    scope: {
      default: '@'
    },
    template: '<select ng-options="key as value for (key, value) in myMap"><option value="">{{ default }}</option></select>',
    link: function postLink(scope, element) {
      scope.myMap = {"bmw":"BMW","maz":"Mazda","aud":"Audi"}; // e.g. hashmap from server
    }
};

И тогда ваш HTML становится:

<my-select ng-model="myModel" ng-change="doSomething(myModel)" default="Search all cars">
</my-select>
person morloch    schedule 16.04.2014
comment
@morlock да, это решило бы проблему переноса. Просто я делаю эту директиву, чтобы я мог выбрать, нужна ли мне пустая опция по умолчанию или нет. Я обновлю свой вопрос. - person Jan-Terje Sørensen; 16.04.2014

У меня была та же проблема, что и у вас, и, к сожалению, ответ @morloch мне не помог. В моем случае трансклюзия динамическая.

Я начал с вашего плункера и понял, что если мы используем трансклюзию во время предварительной ссылки, это решает проблему.

   link: {
      pre:function preLink(scope, element, attrs, controllers, transcludeFn) {
        scope.myMap = {"bmw":"BMW","maz":"Mazda","aud":"Audi"}; // e.g. hashmap from server
        transcludeFn(scope, function(clone) {
          element.append(clone);
        });
      }
    } 

Вот мой плункер: http://plnkr.co/edit/4V8r6iW2aKCLLbpIZc5e?p=preview

person Ash    schedule 19.05.2016