如何使用 Angular js 验证选择字段（下拉列表）。单击按钮时答案

【问题标题】：How to validate a select filed(drop down) with angular js. when click on a button如何使用 Angular js 验证选择字段（下拉列表）。单击按钮时
【发布时间】：2016-01-21 18:57:07
【问题描述】：

如何使用 Angular js 验证选择字段（下拉）。单击按钮时验证空值

按钮始终需要启用。如果下拉菜单将“选择值”作为默认选项，则单击按钮时会提示错误

【问题讨论】：

这个有运气吗？

标签： angularjs

【解决方案1】：

Here (Plunker) 是您的功能的原始实现。

我们基本上有两个部分：

index.html

<!DOCTYPE html>
  <html>
   <head>
     <link rel="stylesheet" href="style.css">
     <script src="https://code.angularjs.org/1.4.8/angular.js"></script>
     <script src="script.js"></script>
   </head>

   <body ng-app="MyApp">
     <div ng-controller = "MyAppCtrl">
       <h1>Validating input</h1>

       <form ng-submit="submit(dropSelection)">
         <label for="search.mode">Select: </label>
         <select ng-model="dropSelection" ng-options="opt for opt in options"></select>
         <button type="submit">Validate</button>
       </form>
     </div>
   </body>

 </html>

app.js

var MyApp = angular.module('MyApp', []);

MyApp.controller('MyAppCtrl', function($scope){

  $scope.options = ["opt 1", "opt 2", "opt 2", "opt 3"];

  $scope.submit = function(selection){
    if(selection === undefined){
      alert('ERROR: Plese select option!');
    }else{
      alert("You've selected: " + selection );
    }

  };

 });

【讨论】：