在Angularjs中要求下拉输入

时间:2018-07-24 17:59:09

标签: angularjs

我们有一个不再由我们团队成员参与的表格。在表单中,存在一个下拉字段,用户可以选择该下拉字段对正在提交的“问题”进行分类。最初开发时,我们不需要将数据输入此字段。现在,我们要进行选择,然后再提交。我实际上对angularjs不了解,因此我想对如何修改现有代码块进行选择提供帮助。任何帮助或指示,将不胜感激。

<div class="form-group">
    <div class="dropdown">
        <button class="btn-dropdown btn-primary btn-block dropdown-toggle" 
                      data-toggle="dropdown" 
                      aria-expanded="false" 
                      type="button">{{c.data.issueType}} <span class="caret"></span></button>
        <ul class="dropdown-menu" role="menu">
          <li role="presentation" ng-click="c.data.issueType = 'Issue Category A'"><a>Issue Category A</a></li>
          <li role="presentation" ng-click="c.data.issueType = 'Issue Category B'"><a>Issue Category B</a></li>
          <li role="presentation" ng-click="c.data.issueType = 'Issue Category C'"><a>Issue Category C</a></li>
         </ul>
     </div>
 </div>

1 个答案:

答案 0 :(得分:0)

似乎是在实现选择的一种奇怪尝试。按钮标记不支持必需的属性。我认为以下是您想要的非常简单的示例: '

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

app.controller('myController', function() {
  this.data = {
    issueType: 'Issue Category B'
  };
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div class="form-group" ng-controller="myController as c">
    <div>
      <select ng-model="c.data.issueType" required>
        <option value="">Select an Issue Category</option>
        <option value="Issue Category A">Issue Category A</option>
        <option value="Issue Category B">Issue Category B</option>
        <option value="Issue Category C">Issue Category C</option>
      </select>
    </div>
    <span ng-if="!c.data.issueType">Required</span>
  </div>