Use la función $setValidity en Angular
El angular $setvalidity()
es una función que establece la validez del campo de formulario dado. Esta función se puede utilizar tanto en el constructor como en otros métodos de controlador.
Este artículo mostrará cómo usar $setValidity
dentro de un controlador. También mostrará cómo establecer la validez de la entrada en el lado del servidor antes de enviarla al lado del cliente.
el $setValidity
en Angular
Angular proporciona una directiva llamada $setValidity
, que puede establecer la validez de la entrada. Se usa dentro del controlador y no dentro de una vista.
La función $setValidity
asigna un par clave/valor que puede usarse para validar la validez de un elemento de formulario.
La clave es única y el valor es verdadero o falso en este contexto. El valor específico se agrega a un objeto $error
cuando se llama al método $setValidity
, que puede usarse para verificar si un valor es aceptable o no.
La función $setValidity
se puede utilizar de las siguientes formas:
-
Establecer la validez de un formulario completo:
$scope.$setValidity($scope.myForm, 'myFormIsValid');
-
Establecer la validez de un campo:
$scope.$setValidity($scope.myForm, 'fieldName', true);
Es importante tener en cuenta que la directiva $setValidity
no afecta la validez de un campo de formulario. Simplemente establece la validez de un campo de formulario y su validador correspondiente.
Paso para usar $setValidity
dentro de un controlador en Angular
Este tutorial demostrará cómo usar $setValidity
dentro de un controlador en Angular.
-
Crear un Controlador con el nombre
HomeController
. -
Importar los módulos
$setValidity
yFormsModule
. -
Crear una función llamada
$setValidity()
. Dentro de esta función, asignaremos el valor de$setValidity
contrue
ofalse
. -
Llame a esta función dentro del evento
ngOnInit()
. Esto asegurará que cuando se inicialice la aplicación Angular, llamará a nuestra función$setValidity()
.
Analicemos un ejemplo de cómo usar $setValidity
en Angular siguiendo los pasos mencionados anteriormente.
Código JavaScript:
angular.module('Adil', [
'ngRoute',
'ui.router'
])
.controller('HomeController', ['$scope', function ($scope) {
$scope.loading = false;
$scope.init = function () {
$scope.data = {
};
};
$scope.save = function (data, form) {
console.log(form);
form.input.$setValidity("name", true);
}
$scope.init();
}]);
Código HTML:
<html>
<head>
<h1>Example of $setValidity in Angular</h1>
<script src="script.js"></script>
</head>
<body ng-app="Adil">
<form name="Name" ng-controller="HomeController">
<div class="form-group">
<label>Please Enter a Valid URL of your Website</label>
<input type="url" />
<span ng-show="Name.input.$valid"></span>
</div>
<button ng-click="save(data, Name)">Save</button>
</form>
</body>
</html>
Haga clic aquí para comprobar el funcionamiento del código anterior.
Muhammad Adil is a seasoned programmer and writer who has experience in various fields. He has been programming for over 5 years and have always loved the thrill of solving complex problems. He has skilled in PHP, Python, C++, Java, JavaScript, Ruby on Rails, AngularJS, ReactJS, HTML5 and CSS3. He enjoys putting his experience and knowledge into words.
Facebook