In the below code,
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular.js"></script>
<script type="text/javascript">
function MyController() {
this.Name = "jag";
this.sal = "4500";
}
MyController.prototype.getAnnualSal = function(){
return (this.sal) * 12;
}
var app = angular.module("sample", []).run(function($rootScope) {
$rootScope.variable = 1;
});
app.controller("emp", MyController);
</script>
</head>
<body ng-app="sample">
<div ng-controller="emp as o" >
Hello {{o.Name}}, your annual salary is {{o.getAnnualSal()}}
</div>
</body>
</html>
Using run
syntax, $rootScope.variable
is introduced at module(sample
) level.
What is the syntax to access $rootScope.variable
in MyController?
Inject rootScope in controller like this.
angular.module('sample', []).controller('emp', function($scope, $rootScope) {
};
Aside from your issue I dont know why you are mixing controller code in view.Angular is built on MVVM pattern.So separation of controller and view is recommended.