Я хочу пустую опцию с md-select, и я хочу, чтобы она не проверялась при необходимости - PullRequest
Новая
       16

Я хочу пустую опцию с md-select, и я хочу, чтобы она не проверялась при необходимости

0 голосов
/ 05 октября 2018

Я использую Angular Material и md-select, и я хотел бы сделать пустой параметр таким, чтобы при его выборе у вас не было значения в выборе.В случае, если я сделаю это обязательным, я бы хотел, чтобы эта опция возвращала ложь при проверке.

Вот пример: https://plnkr.co/edit/FZ8xt5ZCRJY3fFMh3fFU?p=preview

<html>
  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</ript>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.2.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js" data-semver="1.2.19"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <form>
      <select ng-model="selectedValue2" required >
        <option ng-repeat="option in options['id'] | orderBy: 'id'" ng-value="option.value">{{option.name}}</option>
      </select>
      <button type="submit">Submit</button>
    </form>
  </body>  
</html>

Моя ситуация более сложная, поэтомуЯ не хочу обходного пути, я просто хотел бы, чтобы при работе с пустым параметром работала необходимая работа.

Ответы [ 2 ]

0 голосов
/ 08 октября 2018

Попробуйте добавить следующий сегмент кода: 

<md-option ng-value disabled>Choose One</md-option>
0 голосов
/ 05 октября 2018

ВОПРОС ИЗМЕНЕН ПОСЛЕ ЗАПРОСА.Первоначально не о md-select, так что может быть лучший способ сделать это.Все, что вам нужно сделать, это добавить эту опцию в md-select: 

<md-option value=""></md-option>

и удалить запись blank из вашего объекта.

HTML 

<select ng-model="selectedValue2" required >
    <option value=""></option>
    <option ng-repeat="option in options['id'] | orderBy: 'id'" ng-value="option.value">{{option.name}}</option>
</select>

JavaScript 

$scope.options = {id : [
    {name : 'World', value : 'World', id:3},
    {name : 'qweqwe', value : 'qweqwe', id:1},
    {name : 'rwerasdf', value : 'rwerasdf', id:2}
]}

Этого будет достаточно, если вы используете обычный select, но md-select считает нулевое значение для удовлетворения required атрибут, так что вам нужна дополнительная работа.

В ваш выбор, добавьте функцию checkNull для запуска onchange: 

 ng-change="checkNull()"

Затем добавьте ее в свою область: 

$scope.checkNull = function(){
    if(typeof $scope.selectedValue2 === "undefined"){
        $scope.myform.myselect.$setValidity("required", false);
    }
};

Рабочая скрипка

...