Удаление значений с помощью кнопки очистки с AngularJS

Question

Удаление значений с помощью кнопки очистки с AngularJS

0

Я могу очистить весь набор входов, но дело в том, что оно очищается только тогда, когда его значение действительно. Когда это не так, это уже не ясно.

Что-то нужно добавить, и я могу сделать это, используя вручную каждый цикл. Однако я стараюсь избегать этого решения и что-то вроде меньшего кода, поэтому, возможно, кто-то уже придумал решение. Мой текущий код:

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

app.controller('myCtrl', function($scope) {

  $scope.input = {};

  $scope.clear = function() {
    $scope.input = {};

    angular.forEach(angular.element("input"), function() {
      _this = angular.element(key);
      _this.val("");
    });
  };
});

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="myCtrl">
    <form name="principalManagementForm">
      First Name:
      <input type="text" ng-model="input.firstName" name="firstName" id="firstName" minlength="5"><span ng-show="principalManagementForm.firstName.$invalid">First Name not over 5</span>
      <br>Last Name:
      <input type="text" ng-model="input.lastName" name="lastName" id="lastName" minlength="5"><span ng-show="principalManagementForm.lastName.$invalid">Last Name not over 5</span>
      <br>Code:
      <input type="text" ng-model="input.code" name="code" id="code" minlength="3"> <span ng-show="principalManagementForm.code.$invalid">Code not over 3</span>
      <br>
      <br>
      <button ng-click="clear()">Clear</button>

      {{ input }}
    </form>
  </div>

</body>

</html>

Dean Christian Armada 22 март 2016, в 10:27

Источник

0

Что вы подразумеваете под неверным значением? Ваш код, кажется, работает нормально для меня.
Shashank Agrawal 22 март 2016, в 08:52
0

Какой браузер вы используете?
Shashank Agrawal 22 март 2016, в 08:55
1

Извините, но я вставил неправильный код. Я получил новый код опубликован
Dean Christian Armada 22 март 2016, в 08:57

Показать ещё 1 комментарий

Теги:

angularjs

1 ответ

Ещё вопросы

Что вы подразумеваете под неверным значением? Ваш код, кажется, работает нормально для меня.
Извините, но я вставил неправильный код. Я получил новый код опубликован

Shashank Agrawal · Accepted Answer · 2016-03-22T07-07-00.000Z

Просто используйте ng-model-options с allowInvalid:

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

app.controller('myCtrl', function($scope) {

  $scope.input = {};

  $scope.clear = function() {
    $scope.input = {};

    angular.forEach(angular.element("input"), function() {
      _this = angular.element(key);
      _this.val("");
    });
  };
});

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="myCtrl">
    <form name="principalManagementForm">
      First Name:
      <input type="text" ng-model="input.firstName" name="firstName"
             id="firstName" minlength="5" ng-model-options="{allowInvalid: true}">
      <span ng-show="principalManagementForm.firstName.$invalid">First Name not over 5</span>
      
      <br>Last Name:
      <input type="text" ng-model="input.lastName" name="lastName"
             id="lastName" minlength="5" ng-model-options="{allowInvalid: true}">
      <span ng-show="principalManagementForm.lastName.$invalid">Last Name not over 5</span>
      
      <br>Code:
      <input type="text" ng-model="input.code" name="code" id="code"
             minlength="3" ng-model-options="{allowInvalid: true}">
      <span ng-show="principalManagementForm.code.$invalid">Code not over 3</span>
      
      <br>
      <br>
      <button ng-click="clear()">Clear</button>

      {{ input }}
    </form>
  </div>

</body>

</html>

Идеальный ответ! Никогда не думал, что есть такой атрибут или вариант. Это именно то, что мне нужно!