Here is the structure of my HTML...
<body id="main">
{{pageName}}
</body>
This is how I implement it in JavaScript:
angular.module('myApp',[])
.controller('myController', function($scope){
console.log('initialized');
$scope.pageName = 'My page';
});
angular.element(document).ready(function(){
angular.bootstrap(document.getElementById('main'), ['myApp']);
});
After implementing, my HTML looks like this:
{{pageName}} instead of displaying 'My Page'
I noticed that if I change my code to:
<body id="main" ng-controller="myController">
</body>
it starts working properly. But why do I need to use ng-controller?
I hope that explains my issue clearly. Looking forward to some insights on this matter.