Problem description: The system has two navigation bars, one is kendo's menu, and the other is kendo's mobilegroupbutton.
The system has added ui-router-extras related js, and angular has also set sticky: true.
The mobilegroupbutton is generated according to the options of the kedo menu. Now the groupbutton looks for the object value of the current option.
If not, add it to the groupbutton, then
$state.go(dataItem.widget,{'menuItem':dataItem}, {reload: true});
If it exists, directly
$state.go(dataItem.widget,{'menuItem':dataItem});
The groupbutton can also be navigated using kendo's onselect event:
$scope.onSelect = function(e) {
$state.go(tabButtonValues[e.index].widget,{'menuItem':tabButtonValues[e.index]});
$scope.tempMenuItem=tabButtonValues[e.index];
};
problem analysis:
If you always use menu navigation, the status of each page can be retained without refreshing;
If you always use groupbutton navigation, the status of each page can also be retained without refresh;
However, if the two are used alternately, there will be a page refresh problem. Compare the difference between the two:
$state.go(dataItem.widget,{'menuItem':dataItem});
$state.go(tabButtonValues[e.index].widget,{'menuItem':tabButtonValues[e.index]});
The only difference between the two is the value of the parameter 'menuItem'. The problem is found. When the groupbutton is generated according to the menu, the item value in the entire menu is not assigned to the groupbutton. As a result, the parameter objects transmitted during alternate navigation are not exactly the same.
Summary: To keep the state unchanged, the url is the same, and the parameter objects must be the same.