ng-repeat not working as expected -
i started learning angularjs, trying out different examples.
due reason ng-repeat not working
appreciate help.
<!doctype html> <html> <head> <meta charset="utf-8" /> <title></title> <script data-require="angular.js@*" data-semver="2.0.0-alpha.31" src="https://code.angularjs.org/2.0.0-alpha.31/angular.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> <script> var app = angular.module('myapp', []); app.controller('myctrl', function ($scope) { $scope.fname = "joe"; $scope.lname = "mathew"; $scope.fullname = function () { return $scope.fname + " " + $scope.lname; } }); </script> </head> <body> <div ng-controller="myctrl" ng-app="myapp"> first name : <input type="text" ng-model="fname" /> <br /> last name : <input type="text" ng-model="lname" /> <br /> <br /> full name : {{fname + " " + lname}} </div> <div> <ul ng-controller="namesctrl" ng-app="myapp2"> <li ng-repeat="item in names"> {{ item.name + ', ' + item.country }} </li> </ul> <script> var myapp2 = angular.module('myapp2', []).controller('namesctrl', ["$scope", function ($scope) { $scope.names = [ { name: 'jani', country: 'norway' }, { name: 'hege', country: 'sweden' }, { name: 'kai', country: 'denmark' } ]; }]); </script> </div> </body> </html> when run above example see below output
{{ item.name + ', ' + item.country }} but not full list.
there nothing wrong ng-repeat. modified code little bit in plunk: http://plnkr.co/edit/nmkb4dzec1yslmik4rxf?p=preview
and changes made include this:
var app = angular.module('myapp', []); app.controller('myctrl', function ($scope) { $scope.fname = "joe"; $scope.lname = "mathew"; $scope.fullname = function () { return $scope.fname + " " + $scope.lname; } }); app.controller('namesctrl', function ($scope) { $scope.names = [ { name: 'jani', country: 'norway' }, { name: 'hege', country: 'sweden' }, { name: 'kai', country: 'denmark' } ]; }); for more reference, can read this:
Comments
Post a Comment