Angular JS is a new technology for me. I have two modules, first2a and first22. Each module contains a controller named model1 and model2.
Here is the HTML code:
<!DOCTYPE html>
<html >
<head>
<link rel="icon" type="image/png" href="globe/images/correct.png"/>
<link rel="stylesheet" type="text/css" href="globe/css/style.css"/>
<script type="text/javascript" src="globe/script/jquery.js"></script>
<script type="text/javascript" src="globe/script/angular.js"></script>
<script type="text/javascript" src="globe/script/mainscope1.js"></script>
<script type="text/javascript" src="globe/script/angular-route.js"></script>
<title>
Html5 All in One
</title>
</head>
<body >
<div ng-app="first22" id="maincontainer" >
<div ng-controller="model1">{{message}}</div>
</div>
<div id="Interactive_content" ng-app="firsta" >
<div ng-controller="model2">{{message}}</div>
</div>
</body>
</html>
mainscope1.js
var first2 = angular.module('first22', []);
first2.controller('model1',function($scope)
{
$scope.message="aaaaaaa";
})
var first2a=angular.module('firsta',[]);
first2a.controller('model2',function($scope)
{
$scope.message="aaaaaaa1";
})
I'm facing an issue with the firsta module not working properly. Can someone help me troubleshoot this? Thank you!