Очистить ввод текста при нажатии на AngularJS

Как очистить ввод текста нажатием кнопки с помощью angularJS?

Search input

X - отдельная ссылка, на которой я хотел бы вызвать функцию.

HTML

<input type="text" class="form-control" data-ng-model="searchAll">
<a class="clear" data-ng-click="clearSearch()">X</a>

Ответ 1

Просто очистите значение модели области при событии клика, и оно должно сделать трюк для вас.

<input type="text" ng-model="searchAll" />
<a class="clear" ng-click="searchAll = null">
    <span class="glyphicon glyphicon-remove"></span>
</a>

Или если вы сохраните функцию контроллера $scope и очистите ее оттуда. Убедитесь, что вы правильно настроили ваш контроллер.

$scope.clearSearch = function() {
    $scope.searchAll = null;
}

Ответ 2

$scope.clearSearch = function () {
    $scope.searchAll = "";
};

http://jsfiddle.net/nzPJD/

JsFiddle, как вы могли бы это сделать без использования встроенного JS.

Ответ 3

Проще и короче:

 <input type="text" class="form-control" data-ng-model="searchAll">
 <a class="clear" data-ng-click="searchAll = '' ">X</a>

Это всегда срабатывало для меня.

Ответ 4

Если вы хотите очистить всю форму, вы можете использовать такой подход. Это ваша модель в контроллер:

    $scope.registrationForm = {
    'firstName'     : '',
    'lastName'      : ''
};

Ваш HTML:

<form class="form-horizontal" name="registrForm" role="form">
   <input type="text" class="form-control"
                       name="firstName"
                       id="firstName"
                       ng-model="registrationForm.firstName"
                       placeholder="First name"
                       required> First name
   <input type="text" class="form-control"
                       name="lastName"
                       id="lastName"
                       ng-model="registrationForm.lastName"
                       placeholder="Last name"
                       required> Last name
</form>

Затем вы должны клонировать/сохранять свое ясное состояние с помощью:

$scope.originForm = angular.copy($scope.registrationForm);

Ваша функция reset будет:

$scope.resetForm = function(){
    $scope.registrationForm = angular.copy($scope.originForm); // Assign clear state to modified form 
    $scope.registrForm.$setPristine(); // this line will update status of your form, but will not clean your data, where `registrForm` - name of form.
};

Таким образом, вы можете очистить всю свою форму

Ответ 5

Самый простой способ очистки / reset текстовое поле при щелчке - очистить /reset область

<input type="text" class="form-control" ng-model="searchAll" ng-click="clearfunction(this)"/>

В контроллере

$scope.clearfunction=function(event){
   event.searchAll=null;
}

Ответ 6

Вдохновленный из ответа Роберта, но когда мы используем,

ng-click="searchAll = null" в фильтре он делает значения модели как null и, в свою очередь, поиск не работает с его нормальной функциональностью, поэтому было бы лучше использовать ng-click="searchAll = ''" вместо

Ответ 7

В вашем контроллере

$scope.clearSearch = function() {
     $scope.searchAll = '';
}

Ответ 8

Попробуйте это,

 this.searchAll = element(by.xpath('path here'));
 this.searchAll.sendKeys('');