AngularJS: ng-model not clearing input

Question

I have a dynamic input for CPFs (Brazilian 'social security' number).

Every time I enter one CPF, another input should be displayed, and so on.. But for some reason, the ng-model is not being cleared after the CPF is added.

Here's my HTML (inside a directive with isolate scope):

<div ng-repeat="cpf in cpfs" class="field-input">
    <input type="text" class="field" ng-model="cpf.number" required>
    <label>added CPF</label>
</div>
<div class="field-input">
     <input type="text" class="field" ng-model="cpf.number" required>
     <label>add new CPF</label>
     <button ng-click="addCpf(cpf)" class="btn btn-primary">add</button>
</div>

Here's my controller (inside a directive with isolate scope):

$scope.cpfs = [];

$scope.addCpf = function(cpf) {
     $scope.cpfs.push(angular.copy(cpf));     
     delete $scope.cpf;
 };

use $scope.cpf = undefined;

Suresh Mahawar
– Suresh Mahawar

2015-10-07 05:46:11 +00:00
Commented Oct 7, 2015 at 5:46 — Suresh Mahawar
– Suresh Mahawar, Commented Oct 7, 2015 at 5:46

Punit · Accepted Answer · 2015-10-09 07:12:02Z

3

instead of delete $scope.cpf; use $scope.cpf.number = "";

we can't delete an model, we have to set it to blank, because its linked with our View part

edited Oct 9, 2015 at 7:12

answered Oct 5, 2015 at 21:42

Punit

4055 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Dan Beaulieu Over a year ago

please add a brief description as to how your solution resolves the askers problem. How to Answer

Punit Over a year ago

we can't delete an model, we have to set it to blank, because its linked with our View part

Collectives™ on Stack Overflow

AngularJS: ng-model not clearing input

1 Answer 1

2 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Related