CODEWITHSUNDEEP
angularjsangularjs-ng-repeat
Vivendi
Vivendi

Reputation: 21097

ng-repeat not showing items in array

I'm using AngularJS and I'm trying to use ng-repeat, but I can't get it to work.

My view looks like this:

<a href="#" ng-click="addWidget('blaat')">Widget 1</a>

<div ng-repeat="widget in widgets">
    A: {{widget.url}}
</div>

And my controller looks like this:

.controller('PageController', ['$scope', function($scope) {

    $scope.widgets = [];

    $scope.addWidget = function($widgetUrl) {
        $scope.widgets.push({
            url: $widgetUrl
        });

        console.log($scope.widgets);
    }
}])

When I press on the href link then it should add an item to the widgets array and ng-repeat should pick that up. But I don't see anything appear in my view.

But I do see that console.log is printing the right values to console. So my controller functiojn IS working. Then is my ng-repeat not showing anything?

You can view my demo here: http://ngrepeat.byethost7.com/#/page

This was the only way I could reproduce it. (if you see ads at first, then simply refresh the page. It's a free host)

Upvotes: 0

Views: 200

Answers (1)

David Spence
David Spence

Reputation: 8079

Your code works fine if you remove the href="#" from the anchor. The hash is causing your page to reload fresh each time it is clicked. Either remove the href="#" or perhaps consider changing your anchor to a button if page navigation is not actually happening.

Upvotes: 3

Related Questions