CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
Greg-A
Greg-A

Reputation: 852

My ng-repeat does not work

I have a little problem when I generated a ng-repeat, there is nothing going on in the html.

Does someone could help me to settle this problem?

var myApp = angular.module('myApp', [])
.controller('MyCtrl', function($scope){
    list = [];

    $scope.generateAlbum= function() {
        return {
            Name : faker.name.firstName()       
        };
    };

    $scope.generate= function(count) {
        count = count || 25;
        list;
        for (var i = 0; i < count; i++) {
            list.push($scope.generateAlbum());
        }
        return list;
    };

    $scope.generate();

});

and here the html : 

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
    <script src="http://marak.com/faker.js/js/faker.js"></script>
    <script src="js/app.js" type="text/javascript"></script>
</head>
<body>
<main>
    <section ng-controller="MyCtrl">
        <ul ng-repeat="item in list">
            <li>{{item.Name}}</li>
        </ul>
    </section>
</main>

</body>
</html>

and the link with the example : http://plnkr.co/edit/cjm53O4ne8r929jiJoeR?p=preview

Upvotes: 0

Views: 90

Answers (1)

Karmacon
Karmacon

Reputation: 3190

Your list needs to be a scope property. Your functions do not

var myApp = angular.module('myApp', [])
.controller('MyCtrl', function($scope){
  var list = [];

  function generateAlbum() {
        return {
            Name : faker.name.firstName()       
        };
  }

  function generate(count) {
        count = count || 25;
        for (var i = 0; i < count; i++) {
            list.push(generateAlbum());
        }
        $scope.list = list;
    }

    generate();
});

http://plnkr.co/edit/iaNWY9WTt5JYB9oIjAqu?p=preview

Upvotes: 1

Related Questions