Wie lösche ich ein Eingabefeld in AngularJs?

Question

Wenn ein Benutzer etwas in das Eingabefeld eingibt und auf die Schaltfläche Hinzufügen klickt, wird die Eingabe in das Array eingefügt und in der Liste angezeigt.

Allerdings kann ich das Eingabefeld nicht löschen, nachdem ich es in das Array geschoben habe.

Ich bin neu bei AngularJs und würde mich über Hilfe freuen. Vielen Dank im Voraus.

Hier ist mein Code:

<div class="container"> 
<div ng-controller="mainController"> 
<input type="text" ng-model='name' placeholder="name"> 
<input type="text" ng-model='number' placeholder="number"> 
<button ng-click="addToList()">Add</button> 
<ul ng-repeat="person in array_of_Names"> 
    <li>{{$index + 1}}.Name:{{person.name}},Phone:{{person.number}}</li> 
</ul> 
</div> 
</div> 

Und mein app.js:

var myApp = angular.module('myApp', []); 
myApp.controller('mainController',['$scope',function($scope){ 
$scope.array_of_Names = []; 
$scope.addToList = function(){ 
    var person = { 
     name: $scope.name, 
     number: $scope.number 
    }; 
    $scope.array_of_Names.push(person); 
}; 

}]); 

Answer 1

Sie können festlegen,

$scope.number = "" 
$scope.name = "" 

und das wird es auch in der HTML ändern.

Ihr Code wird wie folgt aussehen:

var myApp = angular.module('myApp', []); 
myApp.controller('mainController',['$scope',function($scope){ 
$scope.array_of_Names = []; 
$scope.addToList = function(){ 
    var person = { 
     name: $scope.name, 
     number: $scope.number 
    }; 
    $scope.name = ""; 
    $scope.number = ""; 
    $scope.array_of_Names.push(person); 
}; 

}]); 

Answer 2

$scope.addToList = function(){ 
    var person = { 
     name: $scope.name, 
     number: $scope.number 
    }; 
    $scope.array_of_Names.push(person); 
    $scope.name = null; 
    $scope.number = null; 
}; 

, die den Job tun sollte, nur Ihre addToList Funktion ändern, so sein.