Javascript 如何在angular JS中刷新视图?
在一个web应用程序中,我有一个属于一个或多个帐户的用户,每个帐户中都有事务,当用户更改其帐户时,我需要获取属于该帐户的新事务。我所做的是发出一个指令,可以进行该调用。到目前为止,除了我必须按刷新按钮外,所有事情都正常工作以获取新的数据事务。我的第一个想法是获取当前用户位置并将其重定向到同一位置以刷新数据,但这不起作用Javascript 如何在angular JS中刷新视图?,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,在一个web应用程序中,我有一个属于一个或多个帐户的用户,每个帐户中都有事务,当用户更改其帐户时,我需要获取属于该帐户的新事务。我所做的是发出一个指令,可以进行该调用。到目前为止,除了我必须按刷新按钮外,所有事情都正常工作以获取新的数据事务。我的第一个想法是获取当前用户位置并将其重定向到同一位置以刷新数据,但这不起作用 .directive("accountslist", function(AccountService, Session, $location){ return{
.directive("accountslist", function(AccountService, Session, $location){
return{
restrict:'E',
replace:'true',
template:
'<select ng-change="SetAcc()" ng-model="MyAcc" ng-options="Acc for Acc in userAccounts"></select>',
controller: function($scope){
$scope.userAccounts = AccountService.getAccounts();
$scope.SetAcc = function(){
var userMail = Session.get_user_mail();
var setUser = AccountService.SetUserAccount($scope.MyAcc, userMail);
setUser.then(function(response){
//http call with new data
CategoryService.getCategories();
//here i need to updata the view
},
function(error){
console.log(error);
});
};
}
};
});
假设AccountService中有一个函数getTransactions,用于从服务器检索帐户的所有事务,则可以执行以下操作:
.directive("accountslist", function(AccountService, Session, $location){
return{
restrict:'E',
replace:'true',
template:
'<select ng-change="SetAcc()" ng-model="MyAcc" ng-options="Acc for Acc in userAccounts"></select>',
controller: function($scope){
$scope.userAccounts = AccountService.getAccounts();
$scope.SetAcc = function(){
var userMail = Session.get_user_mail();
AccountService.SetUserAccount($scope.MyAcc, userMail)
.then(function (response) {
return AccountService.getTransactions($scope.MyAcc, userMail);
})
.then(function (transactions) {
$scope.transactions = transactions;
})
.catch(function(error){
console.log(error);
});
};
}
};
});
$location如果让它转到同一个位置,则不会执行任何操作,因为它已经存在。我不完全清楚你想做什么。如果您想再次检索像userAccounts这样的东西,请从中生成一个函数并再次调用它。如果您想让页面的其余部分知道它应该做一些事情,我建议使用$broadcast或$emit。当用户更改为新帐户时,我需要调用HTTP请求以获取新数据,如果在脚本加载时再次单击刷新按钮,则可以执行这些请求。如果我再次调用相同的资源,则最终将复制我的代码,而不是将代码包装到函数中。类似于:var loadMyDate=函数{service.get;}。在您的控制器中,您第一次调用该函数,当单击按钮时再次调用它。我已经这样做了,但是ui没有更新。在您的示例中,我没有看到任何可以这样做的东西。我遗漏了什么吗?问题是指令看不到事务控制器范围,我还必须更新类别控制器。同样的问题会出现,我认为你需要广播。因此,不是调用服务调用$scope。$emit'accountlist-account-changed';在控制器中,在“accountlist-account-changed”中侦听$scope.$,functionevent{//call the reshresh};。我已经更新了问题,我将搜索广播。
.directive("accountslist", function(AccountService, Session, $location){
return{
restrict:'E',
replace:'true',
template:
'<select ng-change="SetAcc()" ng-model="MyAcc" ng-options="Acc for Acc in userAccounts"></select>',
controller: function($scope){
$scope.userAccounts = AccountService.getAccounts();
$scope.SetAcc = function(){
var userMail = Session.get_user_mail();
AccountService.SetUserAccount($scope.MyAcc, userMail)
.then(function (response) {
return AccountService.getTransactions($scope.MyAcc, userMail);
})
.then(function (transactions) {
$scope.transactions = transactions;
})
.catch(function(error){
console.log(error);
});
};
}
};
});