Click here to Skip to main content
14,639,650 members
Rate this:
Please Sign up or sign in to vote.
<!doctype html>
<html data-ng-app="store" >
<head>
    <title>Angular Demo</title>
    <link rel="stylesheet" type="text/css" href="bootstrap.min.css">
   <script type="text/javascript" src="jquery-1.8.2.js"></script>
 <script src="bootstrap.min.js"></script>

 <script  src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.js"></script>
</head>
<body >
    <div  data-ng-controller="itemController as store">
        <ul class="list-group">
        <li class="list-group-item" data-ng-repeat="product in store.product.names">
            <h3>{{store.product.name}}
                    <em class="pull-right">{{store.product.price}}</em>
            </h3>
        </li>
    </ul>

    </div>
    <script type="text/javascript">
    (function(){
       var app = angular.module('store',[]);
app.controller('itemController',function($scope){
    $scope.product = gem;
});

        var gem = [
                        {name:'Item1', price:15},
                        {name:'Item2', price:16},
                        {name:'Item3', price:17},
                        {name:'Item4', price:18},
                        {name:'Item5', price:19}];
})();


    </script>




   <!-- <script src="jquery.js"></script>-->
    <script src="app.js"></script>
</body>
</html>


After viewing the page on my browser and checked the console page, i received this error message

Error: [ng:areq] Argument 'itemController' is not a function, got undefined
Posted
Updated 26-Nov-14 8:11am
v2

1 solution

Rate this:
Please Sign up or sign in to vote.

Solution 1

You should not use product.names with ng-Repeat.
Also, While printing values remove "store."



Try Below Code :

<html data-ng-app="store" >
<head>
    <title>Angular Demo</title>
    <link rel="stylesheet" type="text/css" href="bootstrap.min.css">
   <script type="text/javascript" src="jquery-1.8.2.js"></script>
 <script src="bootstrap.min.js"></script>
 
 <script  src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.3/angular.js"></script>
</head>
<body >
    <div data-ng-controller="itemController as store">
        <ul class="list-group">
        <li class="list-group-item" data-ng-repeat="product in product">
            <h3>{{product.name}}
                    {{product.price}}
            </h3>
        </li>
    </ul>
 
    </div>
    <script type="text/javascript">
    (function(){
       var app = angular.module('store',[]);
app.controller('itemController',function($scope){
    $scope.product = gem;
});
 
        var gem = [
                        {name:'Item1', price:15},
                        {name:'Item2', price:16},
                        {name:'Item3', price:17},
                        {name:'Item4', price:18},
                        {name:'Item5', price:19}];
})();
 

    </script>
 

 

   <!-- <script src="jquery.js"></script>-->
    <script src="app.js"></script>
</body>
</html></link>
   

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100