/ / Angular JS esvaziando o campo de entrada do formulário do controlador ao usar o modelo ng - angularjs, entrada, angularjs-scope, angular-ngmodel

Campo de entrada do formulário de esvaziamento JS angular do controlador ao usar ng-model - angularjs, entrada, angularjs-scope, angular-ngmodel

Eu tenho um formulário muito simples com alguns campos de entrada. Aqui está um:

            <label class="item item-input item-stacked-label">
<span class="input-label">First Name</span>
<input type="text" ng-model="signInData.firstName" placeholder="">
</label>

Quando eu envio o formulário e ele retorna verdadeiro da solicitação AJAX, quero simplesmente esvaziar o campo de entrada, mas não está funcionando. Pode estar faltando algo simples ..

Aqui está meu código de controlador onde estou tentando esvaziar:

        $scope.signInData.firstName = "";

Isso está esvaziando o modelo do escopo, o que posso ver porque estou registrando no console o objeto de escopo, mas simplesmente não esvazia o valor.

Eu pesquisei por um tempo e vi coisas como o método $ setPristine etc, mas nada disso está funcionando também.

EDITAR

    $http({
url: "sign_in_app",
method: "POST",
data: {"firstName": signInData.firstName}
}).then(function(response) {
if(response.data.response == "error"){
$scope.errorSignIn = "Sorry, there was an error signing in.";
}else{
$scope.errorSignIn = null;
$scope.signInData.firstName = "";
$scope.signInForm = null;
}
}

EDIT - o formulário

    <form ng-submit="signIn(signInData)" id="signInForm" name="signInForm">
<div ng-bind-html="errorSignIn" class="center error"></div>
<div class="list">
<label class="item item-input item-stacked-label">
<span class="input-label">First Name</span>
<input type="text" ng-model="signInData.firstName" placeholder="">
</label>

<label class="item">
<button class="button button-full button" type="submit">Sign in</button>
</label>
</div>
</form>

EDITAR 3 - CHAMADA HTTP ATUALIZADA

    $http({
url: "/sign_in/sign_in_app",
method: "POST",
data: {"firstName": $scope.signInData.firstName, "lastName": $scope.signInData.lastName}
}).then(function(response) {
if(response.data.response == "error"){
$scope.errorSignIn = "Sorry, there was an error signing in.";
}else{
$scope.errorSignIn = null;
$scope.signInData.firstName = "";
$scope.signInForm = null;
}

}

Respostas:

1 para resposta № 1

Experimente o seguinte: remova o signInData de ng-submit, altere o seu $scope.signIn() método para não precisar mais disso, use o $scope.signInData objeto para definir todos os valores para o seu $http chamada (que, a propósito, provavelmente deve estar em umpara manter seu controlador mais limpo e seguir os padrões de projeto angulares típicos) e, em seguida, veja se você ainda tem o problema de que as entradas de formulário não estão sendo apagadas.

Minha suspeita é que porque você está passando signInData desse ponto em diante, você começa a operar em uma cópia do objeto de escopo e é por isso que limpar as propriedades não está se comportando como você esperava.


1 para resposta № 2

$setPristine não limpa os campos de entrada. Você pode tentar usar $scope.signInData = {}; depois de enviar o formulário