问题描述
我正在尝试让$ rootScope.$ broadcast刷新我的视图.该服务是-
I am trying to get $rootScope.$broadcast to refresh my view.The service is-
var app = angular.module("productsApp", [])
.service("serviceProvider", function ($http) {
this.getDatas = function getDatas(data) {
return $http({
method: 'POST', url: serviceUrl + '/GetProductsByCategoryOrName', headers: {
'Authorization': apiKey
},
data: data
})
}
return this
}).factory("sharedService", function ($rootScope) {
var mySharedService = {};
mySharedService.values = [];
mySharedService.passData = function (newData) {
mySharedService.values = newData;
$rootScope.$broadcast('dataPassed', newData);
}
return mySharedService;
});
通过控制器调用-
function searchProductsController($scope, $window, serviceProvider, sharedService) {
$scope.submit = function () {
var data = { "query": $scope.searchText, "categoryId": "976759", "pageIndex": 0, "sortDirection": "asc" };
serviceProvider.getDatas(data).then(function (response) {
var result = response;
sharedService.passData(result.data.data);
});
}
};
在此控制器sharedService.passData
中,该控制器将新数组传递给服务方法.然后,它尝试通过行$rootScope.$broadcast('dataPassed', newData)
here in this controller sharedService.passData
which passes new array to service method. Then it is trying to broadcast it for the changes with the line- $rootScope.$broadcast('dataPassed', newData)
我不知道为什么它没有广播更改以供查看.还有其他方法可以广播更改吗?
I don't know why it is not broadcasting the changes to view. Is there any other way to broadcast the changes?
注意-我之前的问题如何在控制器之间传输数据无法为我提供任何帮助.
Note-My earlier question How to transfer data between controllers couldn't get me any help.
修改
到目前为止,我已经改变了听众-
So far I've changed in the listeners-
mySharedService.passData = function (newData) {
$rootScope.$broadcast('dataPassed', newData)
}
$rootScope.$on('dataPassed', function (newData) {
mySharedService.values = newData;
})
但是仍然无法刷新视图.
But still can't get refreshed view.
推荐答案
使用$ broadcast或$ emit时.您应该有$ scope.$ on才能收听该事件.
When you use $broadcast or $emit. You should have $scope.$on to listen to that event.
$scope.$on('dataPassed', function(){ //code go here });
编辑:针对问题要求更新工作代码
Update working code for question requirement
var app = angular.module("productsApp", [])
.service("serviceProvider", function ($http) {
this.getDatas = function getDatas(data) {
return $http({
method: 'POST', url: serviceUrl + '/GetProductsByCategoryOrName', headers: {
'Authorization': apiKey
},
data: data
});
}
return this
}).factory("sharedService", ['$rootScope', function ($rootScope) {
var mySharedService = {
values: [],
setValues: function(data){
if(data){
mySharedService.values.length = 0;
data.forEach(function(item){
mySharedService.values.push(item);
});
}
}
};
return mySharedService;
}]);
function GetController($scope, serviceProvider, sharedService, $rootScope) {
var shareData = sharedService;
$scope.products = sharedService.values;
$scope.shareData = sharedService;
var data = { "query": "grocery", "categoryId": "976759", "pageIndex": 0, "sortDirection": "asc" };
serviceProvider.getDatas(data).then(function (response) {
sharedService.setValues(response.data.data);
});
}
function searchProductsController($scope, $window, serviceProvider, sharedService, $rootScope) {
$scope.submit = function () {
var data = { "query": $scope.searchText, "categoryId": "976759", "pageIndex": 0, "sortDirection": "asc" };
serviceProvider.getDatas(data).then(function (response) {
sharedService.setValues(response.data.data);
});
}
};
这篇关于$ rootScope.$ broadcast无法正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!