Ng-Controller-1

 

Ng-controller is used to give the controller name to html block of code. So if you want to add method that will be called on some event like click etc then that will be defined and declared in controller. HTML:

Name:

{{firstName}}

And here is the JS snippet: var app = angular.module('myApp', []); app.controller('myCtrl', function ($scope) { $scope.firstName = "LearnKode"; });

 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Welcome to LearnKode - A code learning platform</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> </head> <body ng-app="myApp"> <div class="container"> <br /> <div ng-controller="myCtrl"> Name: <input class="form-control" type="text" ng-model="firstName"><br> <br> <b>{{firstName}}</b> </div> </div> <script> var app = angular.module('myApp', []); app.controller('myCtrl', function ($scope) { $scope.firstName = "LearnKode"; }); </script> </body> </html>
Output