angularjs - Result not Displayed with $Scope -
here simple html angular js controller
<!doctype html> <html data-ng-app=""> <head> <title></title> </head> <body> //applied controller interacting view <div data-ng-controller="simplecontroller"> <h3>adding simple controller</h3> <ul> //binded data-ng-repeat <li data-ng-repeat="cust in customers"> {{cust.name +' '+ cust.city}} </li> </ul> </div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script> function simplecontroller($scope) { $scope.customers = [ {name: 'john smith', city: 'pheonix'}, {name: 'alan david', city: 'england'}, {name: 'john hello', city: 'arizona'}, {name: 'john fosay', city: 'lester'} ]; } </script> </body> </html>here result not displayed. error in debugger the controller name 'simplecontroller' not registered.
what wrong here?
it because need wrap entire thing module below
html
<!doctype html> <html ng-app="samplemod"> <head> <meta charset="utf-8" /> <title>angularjs plunker</title> <script>document.write('<base href="' + document.location + '" />');</script> <link rel="stylesheet" href="style.css" /> <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> <script src="app.js"></script> </head> <body> //applied controller interacting view <div data-ng-controller="simplecontroller"> <h3>adding simple controller</h3> <ul> //binded data-ng-repeat <li data-ng-repeat="cust in customers"> {{cust.name +' '+ cust.city}} </li> </ul> </div> </body> </html> javascript controller
var app = angular.module('samplemod', []); app.controller('simplecontroller', function simplecontroller($scope) { $scope.customers = [ {name: 'john smith', city: 'pheonix'}, {name: 'alan david', city: 'england'}, {name: 'john hello', city: 'arizona'}, {name: 'john fosay', city: 'lester'} ]; }); 
Comments
Post a Comment