AngularJs object,Arrays and $eval with example

AngularJs object providing a better way to hold data in object form. We can simply define an object with angularJs object.

In this tutorial, I am going to show you

  • AngularJs object
  • AngularJS Array
  • AngularJS $eval

AngularJs object

 how to define AngularJs object.

obj ={s1 :’AngularJS ‘,s2 : ‘With CodeBun’}

Complete code for AngularJs object

<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body ng-app ng-init="obj ={s1 :'AngularJS ',s2 : 'With CodeBun'}">
<p>{{obj.s1}}
{{obj.s2}}
</p>
</body>
</html>

AngularJS Array :

Array is collection of similar data types. it means we can store same types of data in array. So same way in angularJs also we can use array. we can make array of an object also Let’s see the code for angularJs Array.

<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body ng-app ng-init="arrayName = [1,2,3,4,5]">
<p>{{arrayName[0]}}
{{arrayName[1]}}
{{arrayName[2]}}
{{arrayName[3]}}
{{arrayName[4]}}
</p>
</body>
</html>

 

An array of object in angularJS with module and controller.

<html>

<head>

<meta charset="ISO-8859-1">

<title>Insert title here</title>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<script>

var app = angular.module('myApp',[]);

app.controller('myCtrl',function($scope){

var users = [{name : "Jhon", Age : "25"},

{name : "Jhon1", Age : "25"},

{name : "Jhon2", Age : "25"},

{name : "Jhon3", Age : "25"},

{name : "Jhon4", Age : "25"}];

$scope.users = users;});

</script>

</head>

<body ng-app="myApp" ng-controller="myCtrl" >

<p ng-repeat="user in users">

{{user.name+" "+user.Age}}

</p>

</body>

</html>

 

AngularJS $eval

$evel is a function we will use this function in the controller for evaluating an expression. It’s work like expression{{}}.

Difference in $eval and Expression in angularJS

Expressions are used for evaluation in the view(HTML), the $eval is used in the controller function.

Let’s see the complete code how to use $eval in angularJS.

<html>

<head>

<meta charset="ISO-8859-1">

<title>Insert title here</title>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

<script>

var app = angular.module('myApp',[]);

app.controller('myCtrl',function($scope){

$scope.var1 = 10;

$scope.var2 = 20;

$scope.ans = $scope.$eval('var1*var2');

});

</script>

</head>

<body ng-app="myApp" ng-controller="myCtrl" >

<p>

{{ans}}

</p>

</body>

</html>

 

Add a Comment

Your email address will not be published. Required fields are marked *

eighteen − 9 =