問(wèn)題描述

我利用Angular中$broadcast和$on實(shí)現(xiàn)頁(yè)面跳轉(zhuǎn)并且傳遞數(shù)據(jù),但是跳轉(zhuǎn)后收不到數(shù)據(jù)(再次點(diǎn)擊按鈕才會(huì)顯示)具體要求：點(diǎn)擊第一個(gè)頁(yè)面的按鈕，傳遞一個(gè)數(shù)組（如下圖中的shopList數(shù)組）到第二個(gè)頁(yè)面，使得第二個(gè)頁(yè)面能夠接收到shopList數(shù)組

第一個(gè)頁(yè)面

<a ui-sref='app.checkOut' ng-click='checkoutShop(shopList)'><b>結(jié)算</b></a>

對(duì)應(yīng)的controller（是主控制器-父級(jí)）

$rootScope.checkoutShop=function(shop){ var shop_list_data = shop; console.log(shop_list_data); $rootScope.$broadcast(’to_checkout’, shop_list_data);};

第二個(gè)頁(yè)面的controller（是主控制器下的子集）

$scope.$on(’to_checkout’, function(event,data) { console.log(data);});

但是測(cè)試后發(fā)現(xiàn)第二個(gè)頁(yè)面的console.log(data)打印失敗，但是再次點(diǎn)擊又會(huì)成功，是路由的問(wèn)題嗎？具體如下：主頁(yè)面如下，購(gòu)物車是隱藏在側(cè)面的，點(diǎn)擊導(dǎo)航欄中的購(gòu)物車，右側(cè)會(huì)出現(xiàn)購(gòu)物車

剛開(kāi)始：

點(diǎn)擊按鈕后，傳遞數(shù)組并且跳轉(zhuǎn)到另外一個(gè)頁(yè)面，但是并沒(méi)有打印這個(gè)數(shù)組：

再次點(diǎn)擊“結(jié)算”按鈕，就會(huì)打印了：

請(qǐng)問(wèn)這是什么原因？該如何解決呢？

問(wèn)題解答

去掉 ui-sref='app.checkOut' ,方法里先執(zhí)行$broadcast ,再路由跳轉(zhuǎn)。

<a ng-click='checkoutShop(shopList)'><b>結(jié)算</b></a>$rootScope.checkoutShop=function(shop){ var shop_list_data = shop; console.log(shop_list_data); $rootScope.$broadcast(’to_checkout’, shop_list_data); $state.go(’app.checkOut’);};回答2：

為什么要在rootScope下添加點(diǎn)擊事件？直接添加在頁(yè)面的scope看看。

$state.go 跳轉(zhuǎn)頁(yè)面的時(shí)候可以直接傳遞參數(shù)，為什么還要用$broadcast

主控制器-父級(jí)

`$rootScope.checkoutShop=function(shop){ var shop_list_data = shop; console.log(shop_list_data); $state.go(app.checkOut,{data:shop_list_data});};`

主控制器下的子集

.controller(’XXXX’, [’$rootScope’, ’$scope’, ’$stateParams’, function($rootScope, $scope, $stateParams) {console.log($stateParams.data); }])