Question

这是我的代码结构。这里我有相应的多个角色和区域文本框。现在如果我输入了错误的值，那么我该如何清除那个特定的文本框呢？

<tbody>
    <tr ng-repeat="od in default_role">
        <td>{{od.role}}</td>
        <td>
            <datalist id="all_region_list"> <option data-ng-repeat="or in list_region" value="{{or}}"> </datalist>
            <input class="form-control" type="text" data-ng-model="region" list="all_region_list" placeholder="Region" title="Region" ng-keyup='get_region_values("Region");' ng-blur='location_value_check("Region",region,$index)'>
        </td>
    </tr> 
</tbody>

Answer 1

您需要将模型的属性（连接到特定文本框）的值设置为''。所以它将清除文本框。

演示：

angular.module('myApp', []).controller('ctrl', function($scope) {
  $scope.list = [
    {
      name: 'name1'
    },
    {
      name: 'name2'
    },
    {
      name: 'name3'
    },
    {
      name: 'name4'
    }
  ];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>

<div ng-app="myApp" ng-controller="ctrl">
  <table>
    <tr ng-repeat="item in list">
      <td><input type="text" ng-model="item.name" placeholder="name" /></td>
      <td><button ng-click="item.name = ''">Clear textbox</button></td>
      <td>Model: {{item | json }}</td>
    </tr>
  </table>
</div>

如果您想在不更改模型的情况下清除文本框：

angular.module('myApp', []).controller('ctrl', function($scope) {
  $scope.list = [
    {
      name: 'name1'
    },
    {
      name: 'name2'
    },
    {
      name: 'name3'
    },
    {
      name: 'name4'
    }
  ];

  angular.element(document).ready(function() {
    $('button').click(function() {
      $(this).parents('tr').first().find('input').val('');
    });
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>

<div ng-app="myApp" ng-controller="ctrl">
  <table>
    <tr ng-repeat="item in list">
      <td><input type="text" ng-model="item.name" placeholder="name" /></td>
      <td><button>Clear textbox</button></td>
      <td>Model: {{item | json }}</td>
    </tr>
  </table>
</div>

如何在angularjs中清除ng-repeat下特定文本框的值

1 个答案: