Angularjs firebase ng在两次三次单击后单击加载值
我有angularjs文件Angularjs firebase ng在两次三次单击后单击加载值,angularjs,firebase,angularjs-ng-click,Angularjs,Firebase,Angularjs Ng Click,我有angularjs文件 <div class="container starter-template"> <div class="col-md-9" > <select ng-model="selectedName" ng-options="x as x.TeamName for x in teams" ng-change="selectedItemChanged()"> <option
<div class="container starter-template">
<div class="col-md-9" >
<select ng-model="selectedName" ng-options="x as x.TeamName for x in teams" ng-change="selectedItemChanged()">
<option value="">Select Team</option>
</select>
</div>
<div class="col-md-3">{{date}} </div>
<hr>
<!-- <div ng-repeat="s in user">
<div ng-repeat="(key, value) in s">
{{selectedName.FirstName}} : {{value["Date"]}} {{value["TimeStamp"]}} {{value["Status"]}}
</div>
</div>-->
<div class="box box-default" style="width:1100px">
<div class="box-header with-border">
<h3 class="box-title">Employee Details </h3>
<div class="row" >
<br/>
<div class="col-lg-3 col-xs-6" ng-repeat="name in fullName">
<!-- small box -->
<div class="small-box bg-aqua" style="height:130px;width:150px;" >
<div class="inner">
<h3></h3>
</div>
<div class="icon">
<i class="ion ion-person" ></i>
</div>
<button ng-click="info(name)" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">More Info
<i class="fa fa-arrow-circle-right"></i>
</button><br/><br/>
<center><b><p >{{name}}</p></b></center>
</div>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">{{name}}</h4>
</div>
<div class="modal-body">
<p>Clock In : {{clock_in}}</p>
<p>Clock Out : {{clock_out}}</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="box box-default" style="width:1100px">
<div class="box-header with-border">
<h3 class="box-title">Clock In</h3>
<div class="row" >
</div>
</div>
</div>
<div class="box box-default" style="width:1100px">
<div class="box-header with-border">
<h3 class="box-title">Clock Out</h3>
<div class="row" >
</div>
</div>
</div>
<div id="inOut-container">FusionCharts will render here</div>
<div id="attendance-container">FusionCharts will render here</div>
</div>
选拔队
{{date}}
员工详细信息
更多信息
{{name}
&时代;
{{name}}
时钟输入:{{时钟输入}
打卡退出:{{打卡退出}
接近
打卡
打卡
FusionCharts将在此处渲染
FusionCharts将在此处渲染
和一个javascript文件:
app.controller('organization_drill_down', ['$scope', '$firebaseArray', '$firebaseObject', 'FBURL', function($scope, $firebaseArray, $firebaseObject, FBURL){
//current date
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1;
var yyyy = today.getFullYear();
if(dd<10){dd='0'+dd}
if(mm<10){mm='0'+mm}
$scope.date = dd+'/'+mm+'/'+yyyy;
$scope.all_ins = [];
$scope.all_outs = [];
var teams = new Firebase("************");
var time_stamps = new Firebase("*************") //collecting team's data
$scope.teams = $firebaseArray(teams); //teams for select dropdown
$scope.team = [];
$scope.uId = [];
$scope.in = 0;
$scope.out = 0;
$scope.selectedItemChanged = function() {
console.log($scope.selectedName.TeamName);
var ref = new Firebase("**************").orderByChild('TeamName')
.equalTo($scope.selectedName.TeamName) //check if selected team's name matches users
.on('value', function(snap) {
$scope.fullName = [];
$scope.user = snap.val();
angular.forEach($scope.user, function(user,user_key) {
$scope.fullName.push(user["FirstName"]+" "+user["LastName"]);
});
$scope.$digest();
});
};
//info on clicking more info for a specific user
$scope.info = function(name) {
var users = new Firebase("********************");
var name = name.split(" ");
console.log(name);
users.orderByChild('FirstName').equalTo(name[0]) //check if selected team's name matches users
.on('value', function(snap) {
$scope.user = snap.val();
angular.forEach($scope.user, function(user,user_key) {
if(user["LastName"] == name[1]) //checking if firstname and lastname are equal afterbutton click in user node
{
time_stamps.orderByKey()
.equalTo(user_key) //check if selected name's key is in timestamps
.on('value', function(snap) {
$scope.time_stamp = snap.val();
angular.forEach($scope.time_stamp, function(value, key) {
angular.forEach(value, function(value1, key) {
if(value[key]["Date"] == $scope.date ){
if(value[key]["Status"]== "In"){
$scope.all_ins.push(value[key]["TimeStamp"]);
}
else{
$scope.all_outs.push(value[key]["TimeStamp"]);
}
}
});
});
$scope.clock_in = $scope.all_ins[0];
$scope.clock_out = $scope.all_outs.pop();
});
}
});
$scope.$digest();
});
};
}]);
app.controller('organization\u drill\u down'、['$scope'、'$firebaseArray'、'$firebaseObject','FBURL',函数($scope,$firebaseArray,$firebaseObject,FBURL){
//当前日期
var today=新日期();
var dd=today.getDate();
var mm=today.getMonth()+1;
var yyyy=today.getFullYear();
如果(dd看起来像(从我可以通过识别和一些观察收集到的)您正在更新users.orderByChild().equalTo()部分之外的变量
Firebase函数(如您使用的函数)始终是承诺,在本例中,承诺将结束,然后运行on('value',函数(snap){
由于这是一个异步承诺,您可能会将空值保存到要在模式中使用的变量中。在尝试多次后,它最终会给承诺足够的时间来执行,以便获得正确的值
此外,请记住,在
上使用将向firebase节点添加一个侦听器(在“值”更改的条件下),该侦听器将在每次满足条件时(而不仅仅是第一次调用代码时)运行您放入其中的任何代码.您能建议我需要做哪些更改才能使其正常工作吗?我已经检查了您的代码,似乎您正在更新部分的中的变量。标识有点参差不齐,所以很难说(我建议改进它).至于如何使它工作…如果我的答案是对的,那么你应该找到一种方法,将变量赋值放在第二个on
函数中。另一方面,如果我错了,而你已经在那里了,那么不幸的是,我不知道是什么错了。