我创建了两个angular js服务,如下所示:-
var app = angular.module("myApp",[]);
app.service('myServices',function(){
var officeMasterData;
//In this function I fetch the sharepoint list as try to store the data in this service.
this.getDataFromSharepoint = function(){
var deferred = $.Deferred();
var context = new SP.ClientContext('siteUrl');
.......
context.executeQueryAsync(function(){
var listItemEnumerator = colListItem.getEnumerator();
officeMasterData = listItemEnumerator;
return deferredA.resolve(listItemEnumerator);
},function(error){
return deferred.reject(error)
});
return deferred.promise();
}
// Another function in the service to get the data which is already stored from the function above.
this.getDataSaved = function(){
return officeMasterData;
}
});
然后出于其他目的创建第二个服务。 按照我创建的第二项服务的代码。 在这里,我尝试存储当前已登录用户的电子邮件ID。
app.service('userServices',function(){
var userArray = {};
this.getCurrentUserDetails = function(){
var deferred = $.Deferred();
var context = new SP.ClientContext.get_current();
var web = context.get_web();
currentUser = web.get_currentUser();
context.load(currentUser);
context.executeQueryAsync(function(){
userArray['id'] = currentUser.get_email();
return deferred.resolve(userArray['id']);
},function(error){
return deferred.reject(error);
});
return deferred.promise();
}
this.getOtherDetails = function(a){
//gets data from another list based on the email Id that has been generated and appends new data to the array.
..........
context.executeQueryAsync(function(){
userArray['First'] = 'Some';
userArray['Last'] = 'thing';
return deferred.resolve(userArray);
},function(error){
return deferred.reject(error);
});
return deferred.promise();
}
this.getMyDetails = function(){
return userArray;
}
});
然后,我创建了两个控制器,它们将按以下方式使用服务:-
angular.module('myApp').controller('userController',userController);
userController.$inject = ['$scope','userServices'];
function userController($scope,userServices){
var alreadySavedData = userServices.getMyDetails();
if(alreadySavedData['First_Name'] === undefined){
var getCurrent = userServices.getCurrentUserDetails();
var getFurtherCurrent = getCurrent.then(function(res){
return userServices.getOtherDetails(res)
});
getFurtherCurrent.then(function(resArr){
$scope.UserDetails = resArr;
$scope.$apply();
});
}else{
var getCurrent = userServices.getMyDetails();
$scope.getCurrent = resArr;
$scope.$apply();
}
}
这是另一个控制器的代码。
angular.module('myApp').controller('myTController',myTController);
myTController.$inject = ['$scope','myServices','userServices'];
function mTController($scope,myServices,userServices){
var userDetails = userServices.getMyDetails();
var myData = myServices.getDataFromSharepoint();
}
以下是参考的HTML代码:-
<body data-ng-app="myApp">
<div id="main_header" ng-controller="userController as user">
<div id="header_inner1">
<div class="mobile_menu">
<div class="ham1"></div>
<div class="ham2"></div>
<div class="ham3"></div>
</div>
<div id="logo">
<img src="images/myImg.png" alt="imgLogo"/>
</div>
</div>
</div>
<div ng-controller="mTController" id="myTC" style="display:none;margin-top:10px;">
<table>
<thead>
<tr>
<th>ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Company Name</th>
</tr>
</thead>
<tr ng-repeat="tr in offices">
<td data-ng-cloak>{{tr.ID}}</td>
<td data-ng-cloak>{{tr.First_x0020_Name}}</td>
<td data-ng-cloak>{{tr.Last_x0020_Name}}</td>
<td data-ng-cloak>{{tr.Company_x0020_Name}}</td>
</tr>
</table>
</div>
<script src="js/userController.js"></script>
<script src="js/officeController.js"></script>
</body>
这里的问题是我的 mTController 在 userController
之前执行了这里,我要在完全执行 userController 后执行 mTController ,因为从 userController 传递的数据将用于 mTController 进行进一步的操作,并没有发生。
可能是什么问题? 我到处搜寻,但找不到任何解决方案。 任何帮助都是可观的。