如何根据屏幕宽度动态地将子状态转换为父状态或反之？

Question

我有一种情况，我需要在屏幕大小为桌面时嵌套子状态，并在屏幕移动时将子状态转换为父状态。

桌面

<div ui-view="parent">
 <div ui-view="child"></div>
</div>

移动

<div ui-view="child"></div>

最好的方法是什么？ 我正在考虑使用相同的控制器和模板为桌面和移动设备创建一个单独的状态，并根据屏幕宽度导航到状态