angular state sticky true 刷新問題

阅读更多

问题描述：系统有两个导航栏，一个是kendo的menu,另外一个kendo的mobilegroupbutton.

系统已经添加了ui-router-extras相关的js，angular 也设置了sticky:true。

mobilegroupbutton是根据kedo menu的选项来生成的，现在groupbutton里面查找有无当前选项的对象值，

若没有就添加到groupbutton,然后

$state.go(dataItem.widget,{'menuItem':dataItem}, {reload: true});

若存在就直接

$state.go(dataItem.widget,{'menuItem':dataItem});

 

groupbutton也可以导航，用kendo的onselect事件：

 

$scope.onSelect = function(e) {

        

        $state.go(tabButtonValues[e.index].widget,{'menuItem':tabButtonValues[e.index]});

        $scope.tempMenuItem=tabButtonValues[e.index];

 

  };

 

 

问题分析：

若一直使用menu导航，每个页面的状态都可以保留，无刷新;

若一直使用groupbutton导航，每个页面的状态也可以保留，无刷新;

但是两者交替使用，就会出现页面的刷新问题。比较两者的不同：

$state.go(dataItem.widget,{'menuItem':dataItem});

$state.go(tabButtonValues[e.index].widget,{'menuItem':tabButtonValues[e.index]});

 

两者唯一不同就是参数‘menuItem’的值，问题找到了，因在根据menu产生groupbutton时，没有将整个menu里的item值赋值给groupbutton，导致，交替导航时传输的参数对象不完全一样。

 

总结：若要使状态都保持不变，出来url是一样，参数对象也必须一致。