Usa la función $eval en Angular
En Angular, podemos usar el ng-model para vincular la entrada del usuario a un elemento en particular. Pero si queremos acceder al valor de una expresión, podemos usar $eval.
El servicio $eval es un contenedor alrededor del compilador Angular. Proporciona una interfaz limpia para evaluar las expresiones que se le pasan.
Toma una expresión y la evalúa en el contexto del ámbito actual, lo que significa que cualquier enlace de variable del ámbito actual estará disponible dentro de la expresión.
Esto es diferente de vainilla eval. El servicio $eval evalúa una expresión en el contexto del alcance actual, no globalmente como con vanilla eval.
Para usar $eval, debe tener en cuenta que se evaluará en relación con un ámbito específico y no fuera de ningún ámbito.
Pasos para usar la función $eval en Angular
Podemos usar la función $eval para ejecutar una expresión durante la vida útil de la aplicación. Esto puede ser útil para ejecutar código de forma condicional o implementarlo solo una vez.
-
Definir un servicio Angular que contendrá nuestro contexto y la función
$eval. -
Crear una directiva para evaluar expresiones o devoluciones de llamada dentro de su función de enlace.
-
Inyéctelo en el controlador de la directiva y vincúlelo a una variable pública llamada
$eval. -
Use
$evalen su plantilla donde quiera ejecutar código basado en su estado o condicionales.
Analicemos un ejemplo de $eval.
Código JavaScript:
var app = angular.module('Adil', []);
app.controller("Demo", function($scope) {
$scope.int1 = 10;
$scope.int2 = 20;
$scope.result = $scope.$eval('int1 +int2');
});
Código HTML:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.1/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body >
<h2>Example of Angular $eval</h2>
<div ng-app="Adil">
<div ng-controller="Demo">
<input type="text" ng-model="int1" > + <input type="text" ng-model="int2" >
<p
>{{'Result: ' + result}}</p>
</div>
</div>
</body>
</html>
Haga clic aquí para verificar el funcionamiento del código como se mencionó anteriormente.
Pros y contras de usar la función $eval en Angular
Podemos usar la función $eval en Angular para evaluar una expresión en tiempo de ejecución. Es beneficioso cuando desea crear dinámicamente un elemento DOM y agregarlo al DOM o cuando necesita hacer algo con un objeto al que no se puede acceder de otra manera.
Sin embargo, la función $eval tiene algunas desventajas. La primera desventaja es que puede introducir vulnerabilidades de seguridad porque hace que su aplicación sea más susceptible a los ataques de inyección si no se usa correctamente.
La segunda desventaja es que usar $eval significa que su código se vuelve menos legible porque depende de la concatenación de cadenas en lugar de funciones o variables para expresiones más comunes.
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