CODEWITHSUNDEEP
javascriptangularjs
vicky
vicky

Reputation: 2149

AngularJs ng-repeat is not working properly

I am very new to angularjs . I am stuck in ng-repeat directives.

Here is my code :

<html ng-app>
<head>
<title>Looping Example</title>
<script type="text/javascript" src="js/lib/angular.min.js"></script>
<script type="text/javascript" src="js/lib/angular.js"></script>    
   <script type="text/javascript">
    function helloWorldExampleCtrl($scope){
        $scope.userName = "Vicky!"
          $scope.contacts = ["[email protected]", "[email protected]"];
    }
  </script>
 </head>
 <body>

<div> 
   <h1 ng-controller="helloWorldExampleCtrl">Welcome {{userName}} ! <br/>

   Emails : <br>  
   <ul>
     <li ng-repeat="contact in contacts"> {{ contact }} </li>
   </ul>
  </h1>
</div>
</body>
</html>

Output I am getting :

Welcome Vicky! ! 
Emails :
[email protected]
[email protected]
[email protected]
[email protected]

But excepted is :

Welcome Vicky! !
Emails :
[email protected]
[email protected]

What i am doing wrong?.....

Upvotes: 1

Views: 476

Answers (1)

JeffryHouser
JeffryHouser

Reputation: 39408

You have two versions of the AngularJS Library added to your page using the script tag. Remove one to solve the issue:

<html ng-app>
<head>
<title>Looping Example</title>
<script type="text/javascript" src="js/lib/angular.min.js"></script>
   <script type="text/javascript">
    function helloWorldExampleCtrl($scope){
        $scope.userName = "Vicky!"
          $scope.contacts = ["[email protected]", "[email protected]"];
    }
  </script>
 </head>
 <body>

<div> 
   <h1 ng-controller="helloWorldExampleCtrl">Welcome {{userName}} ! <br/>

   Emails : <br>  
   <ul>
     <li ng-repeat="contact in contacts"> {{ contact }} </li>
   </ul>
  </h1>
</div>
</body>
</html>

A Plunker with only one AngularJS import that works

A Plunker with two AngularJS Library Imports that duplicates your problem

Upvotes: 1

Related Questions