【问题标题】:Set default value of a dropdown and reset it in AngularJS设置下拉菜单的默认值并在 AngularJS 中重置它
【发布时间】:2018-04-17 11:52:36
【问题描述】:

所以有一个下拉选择器,必须在默认选项上设置,并且如果单击重置按钮,则能够重置为它。

我设法用 jQuery 做到了,我想知道如何使用 AngularJS 来做到这一点

$('#buttonID').click(function(){
    $('#selectId').val('0');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<select id="selectId">
    <option value="0">first option</option>
    <option value="1">second option</option>
    <option value="2">third option</option>
</select>
<input type="button" id="buttonID" value="reset"/>

有什么建议吗?

【问题讨论】:

标签: javascript jquery html angularjs


【解决方案1】:

您需要有一个选项集合和一个绑定到选择框的模型。重置时,您只需将绑定模型的值更改为您想要的值:

angular.module('app', [])
  .controller('ctrl', function($scope) {
    $scope.opt = 0;
    $scope.options = [{
      value: 0,
      label: 'first option'
    }, {
      value: 1,
      label: 'second option'
    }, {
      value: 2,
      label: 'third option'
    }];
    
    $scope.reset = function() {
      $scope.opt = 0;
    };
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <select id="selectId" ng-options="opt.value as opt.label for opt in options" ng-model="opt">
</select>
  <input type="button" id="buttonID" value="reset" ng-click="reset()"/>
</div>

【讨论】:

    猜你喜欢
    • 2018-09-29
    • 2013-07-22
    • 1970-01-01
    • 1970-01-01
    • 2021-11-24
    • 1970-01-01
    • 2018-05-25
    • 2019-09-25
    相关资源
    最近更新 更多