$ rootScope.$ broadcast无法正常工作 [英] $rootScope.$broadcast not working

问题描述

我正在尝试让$ 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无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！