i've duplicated an angular example w3schools (here), , it's not working. don't understand why. looks should working fine. doing wrong?
here's angular js:
angular.module('myapp', []).controller('thingsctrl', function($scope) { $scope.things = [ {title: 'my title 1', content: 'my content 1'}, title: 'my title 2', content: 'my content 2'}, title: 'my title 3', content: 'my content 3'}, title: 'my title 4', content: 'my content 4'}, title: 'my title 5', content: 'my content 5'}, title: 'my title 6', content: 'my content 6'} ]; $scope.things2 = [ {title: 'my 2nd title 1', content: 'my content 1'}, title: 'my 2nd title 2', content: 'my content 2'}, title: 'my 2nd title 3', content: 'my content 3'}, title: 'my 2nd title 4', content: 'my content 4'}, title: 'my 2nd title 5', content: 'my content 5'}, title: 'my 2nd title 6', content: 'my content 6'} ]; }); here's html:
<!doctype html> <html> <head> <!-- css --> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> <link rel="stylesheet" href="style.css"> <!-- js --> <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> </head> <body> <div ng-app="myapp" ng-controller="thingsctrl"> <h1>hello plunker!</h1> <div class="container"> <div class="row"> <div class="col-sx-6"><h4>my subtitle</h4> <div ng-repeat="x in things"> <div class="col-sx-6 col-sm-4 col-md-2"> <div class="cube"> <b>{{x.title}}</b> </br> {{x.content}} </div> </div> </div> </div> <div class="col-sx-6"><h4>my subtitle</h4> <div ng-repeat="x in things2"> <div class="col-sx-6 col-sm-4 col-md-2"> <div class="cube"> <b>{{x.title}}</b> </br> {{x.content}} </div> </div> </div> </div> </div> </div> </div> <script src="script.js"></script> </body> </html>
you're not opening key/value array each item in list.
{title: 'my title 2', content: 'my content 2'}, title: 'my title 3', content: 'my content 3'}, try:
angular.module('myapp', []).controller('thingsctrl', function($scope) { $scope.things = [ {title: 'my title 1', content: 'my content 1'}, {title: 'my title 2', content: 'my content 2'}, {title: 'my title 3', content: 'my content 3'}, {title: 'my title 4', content: 'my content 4'}, {title: 'my title 5', content: 'my content 5'}, {title: 'my title 6', content: 'my content 6'} ]; $scope.things2 = [ {title: 'my 2nd title 1', content: 'my content 1'}, {title: 'my 2nd title 2', content: 'my content 2'}, {title: 'my 2nd title 3', content: 'my content 3'}, {title: 'my 2nd title 4', content: 'my content 4'}, {title: 'my 2nd title 5', content: 'my content 5'}, {title: 'my 2nd title 6', content: 'my content 6'} ]; }); oh, , check console error:
error: [ng:areq] argument 'myctrl' not function, got undefined your myapp controller incorrect.
Comments
Post a Comment