我们如何从工厂广播更新的数据。我有两个工厂和两个控制器。
服务1:将数据更新到数据库中
app.factory('uac',function($http,$q, $cookies)
{
formData.uClient = function(data)
{
var client = $http.post('add_client/',data)
return $q.all({'response':client})
}
}
服务 2:从数据库获取客户端列表
app.factory('adService',function($http, $q)
{
clientData = {}
clientData.getListofClients = function()
{
var listOfClients = $http.get('get_clients/')
return $q.all({'listOfClients':listOfClients})
}
return clientData
})
控制器 1:将要更新的数据发送到服务
app.controller('acController', function($scope,uac)
{
$scope.clientDatadata = {name:"abcd"}
uac.uClient($scope.clientData)
}
控制器 2:从服务获取客户端数据
app.controller('getDetailsController',function($scope,adService)
{
adService.getListofClients().then(function(data)
{
$scope.clientList = data.listOfClients.data
console.log($scope.clientList)
},
function(error)
{
console.log("Can fetch data")
});
}
首先,我将调用getDetailsController来获取所有客户端,每当通过调用"acController"添加新客户端时,我都希望在"$scope.clientList"中更新客户端列表。我怎样才能完成它?
您可以从发送方控制器$emit事件,并在接收方控制器中侦听它。由于我不确定控制器的层次结构,因此我将$rootScope收听:
控制器 1:将要更新的数据发送到服务
app.controller('acController', function($scope,uac)
{
$scope.clientDatadata = {name:"abcd"}
uac.uClient($scope.clientData).then(function(res){
$scope.$emit('serviceUpdated', res); // you can send data if you wish
});
}
控制器 2:从服务获取客户端数据
app.controller('getDetailsController',function($scope,adService,$rootScope)
{
function getList(){
adService.getListofClients().then(function(data)
{
$scope.clientList = data.listOfClients.data
console.log($scope.clientList)
},
function(error)
{
console.log("Can fetch data")
});
}
getList();
$rootScope.$on('serviceUpdated', getList);
}
有三种方法可以做到这一点:
- (简单)创建一个包含客户端列表的工厂,并直接在您的视图上使用它。
-
myApp.factory('clientList', function () {
return [];
});
调用控制器 2 以获取客户端列表并保存在出厂时:
app.controller('getDetailsController',function($scope,adService, clientList)
{
adService.getListofClients().then(function(data)
{
clientList = data;
},
function(error)
{
console.log("Can fetch data");
});
}
控制器 1:将要更新的数据发送到服务,并将返回的数据保存在 clientList 工厂中
app.controller('acController', function($scope,uac, clientList)
{
$scope.clientDatadata = {name:"abcd"};
clientList = uac.uClient($scope.clientData);
}
此解决方案的问题是,在复杂的应用中,您不希望通过工厂公开数据。
在工厂上实现 getter 和 setter,这样您就不会向视图公开数据,而是让控制器控制它们(使用 $watch)。
按照@Shomz答案上的说明使用$emit。但是,我建议在收到排放后提出另一个获取列表请求。我宁愿广播更新的数据(在本例中为发布/更新请求的响应),而不是更新绑定到视图的变量。