AngularJS: заставить работать выборку по нажатию выпадающего меню, выпуск ngMessages

Question

Итак, у меня есть поле выбора, которое заполняет некоторые значения в раскрывающемся списке, используя ng-options Поэтому я хочу показать сообщения об ошибках, как только пользователь нажмет на выпадающий список и сфокусируется, не делая выбора.

Код JS

$scope.someMap = [{ name:"Abc", id:"a"},
{ name:"XYZ", id:"b"},
{ name:"FGH", id:"c"},
{ name:"TY", id:"d"}
];

HTML

<select  name="inpName"  ng-model="person.name" ng-options="i as i.name for i in someMap track by i.id" required>
        <option value=""  selected hidden/> </select>
        <div ng-messages="form.inpName.$error" ng-if="form.inpName.$touched">
          <div ng-message="required">Required field</div>
            </div>
           </div>

Так что это работает в случае, когда я добавляю пустую опцию, как option value="" selected hidden/> </select> и выберите какое-то допустимое значение, а затем снова выберите пустую опцию, и в поле "Обязательное" появится сообщение об ошибке.

Но, как вы можете видеть, вышеприведенное поле выбора будет пустым после загрузки страницы, поэтому, если использовать щелчок по раскрывающемуся меню и сфокусироваться, не выбирая, или переместиться в другое поле без выбора какого-либо значения, это должно привести к ошибке в качестве поля Обязательное.

Теперь, если я попытаюсь выполнить итерацию по значению form.inpName.$error никогда не будет иметь никакого значения, и я не могу проверить его, используя описанную выше технику.

я пытался ng-show , ng-if , message expression Возможно, мне не хватает некоторого опыта. Все они работают после выбора действительной записи из выпадающего списка и последующего возврата к пустому параметру.

Решения, которые не будут работать для меня

1. Проверьте значение модели: я не хочу переходить к модели для этих типов полей и проверять, не заполнены ли они, а затем отображать какое-то сообщение об ошибке, скорее я хочу пройтись по массиву $ error и найти проблему с полем
2. Сделайте опцию по умолчанию выбранной при загрузке страницы - Невозможно сделать это.
3. Добавить поле в качестве выбранных опций: Это также не будет работать, потому что если пользователь не коснулся выделения и заполнил все остальные поля, $ error не будет заполняться для этого выпадающего списка.

Любая помощь будет высоко ценится, действительно ударил по этому.

Answer 1

Как помогло @Ininiv в вышеприведенном посте, код, который я разместил, отлично работает в plunker, но не в моей среде разработки.

Таким образом, на основе некоторых объектов POJO/Entity out форматируется со свойствами как null. Так что, когда я выбираю и заполняю опцию angular, это не выглядит как изменение в модели, если только я не выберу значение из выпадающего списка и снова не выберу пустой параметр из выпадающего списка, Это активируется.

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

Чтобы решить эту проблему, ngModel нужно было установить на ноль, когда раскрывающийся список активирован $ error, и если я оставлю это поле пустым и перейду в другое поле, появится ошибка.

Так что в основном при смене модели активируется только директива ngMessages, чего не было для выпадающих списков, которые заполнялись на основе некоторых свойств объекта.