我有2个带有不同ng-app模块和不同控制器的Java脚本文件。 我已将这两个文件导入一个html。 on-click和on-init数据在浏览器中得到更新。但是在日期更改时,更新的数据来自服务器 $ scope.crr 正在更新但未在浏览器中显示。请让我知道我错过了什么。
File 1:controller.js
var helloAjaxApp = angular.module("myApp", []);
helloAjaxApp.controller("MenuCtrl", [ '$scope', '$http', function($scope, $http) {
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
$scope.getmenu = function() {
$http({
url : 'menu',
method : "GET"
}).then(function(response) {
$scope.menus = response.data;
});
};
} ]);
helloAjaxApp.controller("BranchCtrl", [ '$scope', '$http', function($scope, $http) {
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
$scope.getbranch = function() {
$http({
url : 'branch',
method : "GET"
}).then(function(response) {
$scope.branch = response.data;
});
};
} ]);
var today = new Date();
var dd = null;
var mm = null;
var yyyy=null;
if(today.getDate()<10)
{
dd="0"+today.getDate();
}
else
{
dd=today.getDate();
}
if(today.getMonth()+1<10)
{
mm=today.getMonth()+1;
mm='0'+mm;
}
else
{
mm=today.getMonth()+1;
}
yyyy = today.getFullYear();
var date=yyyy+'-'+mm+'-'+dd;
helloAjaxApp.controller("CrrdayCtrl", [ '$scope', '$http', function($scope, $http) {
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
$scope.getcrrday = function() {
var x;
if(typeof($scope.date)!="undefined")
{
var a=JSON.stringify($scope.date);
$scope.x=a;
}
else
{
$scope.x=date;
}
$http({
url : 'crrday',
method : "POST",
data : {
'date' : $scope.x+''
}
}).then(function(response) {
$scope.crr = response.data;
});
};
}]);
helloAjaxApp.controller('mytime', function($scope, $interval) {
$scope.theTime = new Date().toLocaleTimeString();
$interval(function () {
$scope.theTime = new Date().toLocaleTimeString();
}, 1000);
});
File 2:JQcontroller.js
var today = new Date();
var dd = null;
var mm = null;
var yyyy=null;
if(today.getDate()<10)
{
dd="0"+today.getDate();
}
else
{
dd=today.getDate();
}
if(today.getMonth()<10)
{
mm=today.getMonth();
mm='0'+mm;
}
else
{
mm=today.getMonth();
}
yyyy = today.getFullYear();
var JQDemo = angular.module("jq", ["jqwidgets"]);
JQDemo.controller("dateController", function ($scope) {
$scope.dateInputSettings =
{
width: 200,
height: 30
}
$scope.date = new Date(yyyy, mm, dd);
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>X</title>
<script type="text/javascript" src="JQ/scripts/angular.min.js"></script>
<script type="text/javascript" src="JQ/scripts/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="JQ/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="JQ/jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="JQ/jqwidgets/globalization/globalize.js"></script>
<script type="text/javascript" src="JQ/jqwidgets/jqxcalendar.js"></script>
<script type="text/javascript" src="JQ/jqwidgets/jqxdatetimeinput.js"></script>
<script type="text/javascript" src="JQ/jqwidgets/jqxangular.js"></script>
<script type="text/javascript" src="JQ/scripts/demos.js"></script>
<script type="text/javascript" src="js/controllers.js"></script>
<script type="text/javascript" src="js/JQControllers.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
<link rel="stylesheet" type="text/css" href="JQ/jqwidgets/styles/jqx.base.css" />
<link rel="stylesheet" type="text/css" href="css/test.css" />
<script>
//angular.bootstrap(document.getElementById("App2"), ['jq']);
angular.module("CombineModule", ["myApp", "jq"]);
</script>
</head>
<body>
<h1 align="center">Enrollment System</h1>
<div ng-app="CombineModule">
<div ng-init="getmenu()" ng-controller="MenuCtrl" >
<nav id="main_nav">
<ul>
<li ng-repeat="menu in menus"><a href="{{menu.url}}">{{menu.name}}</a>
<ul>
<li ng-repeat="submenu1 in menu.submenus"><a href="{{submenu1.url}}">{{submenu1.name}}</a>
<ul>
<li ng-repeat="submenu2 in submenu1.submenus"><a href="{{submenu2.url}}">{{submenu2.name}}</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
<div ng-controller="mytime">
<h4 align="right"><a href="Login.html">Logout</a></h4>
<h3 align="right">{{theTime}}</h3>
</div>
</div>
<div id="widgets" align="left">
<table class="outer">
<tr><td style="color:white;">Quick Status</td></tr>
<tr>
<td>
<div ng-init="getbranch()" ng-controller="BranchCtrl">
<table class="inner">
<th><button ng-click="getbranch()"><img align="right" src="images/refresh.jpg" alt="refresh" height="16" width="16"></button>Branch Details</th>
<tr> <td>
Locations
</td></tr>
<tr> <td>
{{branch.locations}}
</td></tr>
<tr> <td >
Registered BC/Agents
</td></tr>
<tr> <td>
{{branch.bc}}
</td></tr>
<tr> <td>
Active BC`s
</td></tr>
<tr> <td>
{{branch.activebc}}
</td></tr>
</table>
</div>
</td>
<td>
<div ng-init="getcrrday()" ng-controller="CrrdayCtrl">
<table class="inner">
<th><button ng-click="getcrrday()"><img align="right" src="images/refresh.jpg" alt="refresh" height="16" width="16"></button>Today`s Analysis</th>
<tr>
<td>
<div ng-controller="dateController">
<div ng-controller="CrrdayCtrl">
<jqx-date-time-input ng-model="date" jqx-settings="dateInputSettings" data-ng-change="getcrrday()"></jqx-date-time-input>
</div>
</div>
</td>
</tr>
<tr> <td>
Enrollments
</td></tr>
<tr> <td>
{{crr.enrollments}}
</td></tr>
<tr> <td>
Accounts Opened
</td></tr>
<tr> <td>
{{crr.accountsopened}}
</td></tr>
</table>
</div>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>