Controller function in angular?

I'm new to angular js

The controller does not work correctly in my code

I am trying to run the following code

<!DOCTYPE html> <html data-ng-app > <head> <title>Using AngularJS Directives and Data binding</title> </head> <body> name <br /> <div data-ng-controller="SimpleController"> <input type="text" data-ng-model="name"/>{{name}} <ul> <li data-ng-repeat="cust in customers | filter:name | orderBy:city"> {{cust.name | uppercase}}-{{cust.city | lowercase}} </li> </ul> </div> <script src= "angular/angular.min.js"></script> <script> var demoApp = angular.module('demoApp',[]); demoApp.controller('SimpleController', function($scope){ $scope.customers=[ {name:'John Smith', city:'kashipur'}, {name:'John fds' , city:'san francisko'}, { name:'shubham', city:'giarhineg'}, {name:'batra', city:'world'}]; }); </script> </body> </html> </html> 

but it does not give vent to desire.

please tell me if I am doing something wrong.

+5
source share
2 answers

You are missing the value in the ng-app directive that tells angular to run the demoApp module on the page.

 ng-app="demoApp" 
+4
source

You must add the name of your application.

 ng-app="demoApp" 

  var demoApp = angular.module('demoApp', []); demoApp.controller('SimpleController', function($scope) { $scope.customers = [{ name: 'John Smith', city: 'kashipur' }, { name: 'John fds', city: 'san francisko' }, { name: 'shubham', city: 'giarhineg' }, { name: 'batra', city: 'world' }]; }); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="demoApp"> name <br /> <div data-ng-controller="SimpleController"> <input type="text" data-ng-model="name" />{{name}} <ul> <li data-ng-repeat="cust in customers | filter:name | orderBy:city">{{cust.name | uppercase}}-{{cust.city | lowercase}}</li> </ul> </div> </div> 
+1
source

All Articles