As a beginner in Angular JS, I understand that the declaration below is necessary in the js file to make angular JS Controller work:
var app = angular.module('myApp', []);
app.controller('ctrlOne', function(){
});
However, I recently came across some code on the internet where the declaration for the app and controllers was not made as above. Instead, only controller functions were defined, and it worked fine there but not in my case.
https://i.sstatic.net/OgMfM.png
https://i.sstatic.net/Ogspd.png
function ctrlOne($scope){
};
function ctrlTwo($scope){
};
Take a look at my code and output below. Please let me know if you spot any errors.
<div ng-app>
<input type="text" ng-model="data.message" />
<h1>{{ data.message }}</h1>
<div ng-controller="ctrlOne">
<input type="text" ng-model="data.message" />
<h1>{{ data.message }}</h1>
</div>
<div ng-controller="ctrlTwo">
<input type="text" ng-model="data.message" />
<h1>{{ data.message }}</h1>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="App.js"></script>
App.js:
function ctrlOne($scope){
};
function ctrlTwo($scope){
};
https://i.sstatic.net/CT9l6.png
I would appreciate any help in figuring out where I went wrong. All advice is welcomed.
Check out the JSFIDDLE Link for the above coding here
https://i.sstatic.net/jIrmM.png https://i.sstatic.net/x81fS.png