Angularjs Angular JS w/ui.router-使用无序的gobbed url填充多个状态视图？

我使用的ui.router有5个状态，每个状态嵌套在前一个状态中。对于不同的用户类型，每个状态都有多个视图。唯一定义了url的状态是第一个：“”和最后一个：“/：params”，以便将所有状态加载到同一窗口中

现在，由于每个状态都在窗口中，我想解析url参数来控制应用程序，而不需要设置url模型，即，我想获取任意数量的无序参数，并将它们应用到具有$stateParams$范围匹配祖先的每个状态

通过这种方式，我们保留了浏览器历史记录/书签，以匹配ui状态，尽管不需要实际导航到其他位置

这怎么可能呢

angular.module('ecoposApp').config(function($stateProvider, $urlRouterProvider, $anchorScrollProvider) {

$stateProvider.
    state('ecoApp', {
        url:'/',
        templateUrl:'views/main.html',
        onEnter: function(){
            console.log('ecoApp State');
        },
        onExit: function(){
            console.log('goodbye ecoApp state');
        }
    }).
    state('ecoApp.nav',{

        views:{
            admin:{

                template:'<h2 href ng-click="$state.go(\'^\')">Nav Yolo 1</h2>'
            },
            user:{
                template:'<h2 href ng-click="$state.go(\'^\')">Nav Yolo 2</h2>'
            }
        },
        onEnter: function(){
            console.log('NAV State');
        },
        onExit: function(){
            console.log('goodbye Navigation state');
        }
    }).
    state('ecoApp.nav.not',{
        views:{
            admin:{
                template:'<h3 href ng-click="$state.go(\'^\')">Notifications Yolo 1</h3>'
            },
            user:{
                template:'<h3 href ng-click="$state.go(\'^\')">Notifications Yolo 2</h3>'
            }
        },
        onEnter: function(){
            console.log('notifications state');
        },
        onExit: function(){
            console.log('goodbye Notifications state');
        }
    }).
    state('ecoApp.nav.not.tools',{

        views:{
            admin:{
                template: '<h4 href ng-click="$state.go(\'^\')">Tools Yolo 1</h4>'
            },
            user:{
                template: '<h4 href ng-click="$state.go(\'^\')">Tools Yolo 2</h4>'
            }
        },
        onEnter: function(){
            console.log('tools state');
        },
        onExit: function(){
            console.log('goodbye tools state');
        }
    }).
    state('ecoApp.nav.not.tools.settings',{
        url:':params',
        views: {
            admin:{
                template:'<a href ng-click="$state.go(\'^\')">Settings Yolo 1</a></div>',
                controller: function(){

                }
            },
            user:{
                template:'<a href ng-click="$state.go(\'^\')">Settings Yolo 2</a></div>'
            }
        },
        onEnter: function(){
            console.log('settings state');
        },
        onExit: function(){
            console.log('goodbye settings state');
        }
    });

angular.module（'ecoposApp'）.config（函数（$stateProvider、$urlRouterProvider、$anchorcrollProvider）{
$stateProvider。
州（“ecoApp”{
url:“/”，
templateUrl:'views/main.html'，
onEnter:function（）{
console.log（'ecoApp State'）；
},
onExit:function（）{
log（“再见ecoApp状态”）；
}
}).
州（'ecoApp.nav'{
观点：{
管理员：{
模板：'Nav YLO 1'
},
用户：{
模板：'Nav YLO 2'
}
},
onEnter:function（）{
console.log（“导航状态”）；
},
onExit:function（）{
log（“再见导航状态”）；
}
}).
状态（'ecoApp.nav.not'{
观点：{
管理员：{
模板：'Yolo 1'
},
用户：{
模板：'Yolo2'
}
},
onEnter:function（）{
log（“通知状态”）；
},
onExit:function（）{
log（“再见通知状态”）；
}
}).
状态（'ecoApp.nav.not.tools'{
观点：{
管理员：{
模板：“工具Yolo 1”
},
用户：{
模板：“工具Yolo2”
}
},
onEnter:function（）{
console.log（“工具状态”）；
},
onExit:function（）{
log（“再见工具状态”）；
}
}).
状态（'ecoApp.nav.not.tools.settings'{
url:'：参数'，
观点：{
管理员：{
模板：“”，
控制器：函数（）{
}
},
用户：{
模板：“”
}
},
onEnter:function（）{
log（“设置状态”）；
},
onExit:function（）{
log（“再见设置状态”）；
}
});

在上一个州，我们有-

url:'*path?access_level&preferences'

<div ui-view="{{myView}}"></div>

这表示$stateParams上的路径对象可以等于任何值，并且要查找访问级别和首选项查询，则/settings？访问级别=admin&preferences=shop将给此对象-

$stateParams: {path:settings,access_level:admin,preferences:shop}

然后我们的应用程序中有。运行fn-

$rootScope.$stateParams = $stateParams;

在最后一个州的onEnter fn中-

myService.params.data = $stateParams;
if(/^\/settings(\/.*)?$/.test($stateParams.path)){
    myService.view = 'admin@ecoApp.nav.not.tools.settings';
            }

//数据对象充当状态占位符，因此即使在切换状态时，也存在相同的对象

在主控制器中，我们注入myService- $scope.params=myService.params.data； $scope.myView=myService.params.data.path

我们的主要观点是：

url:'*path?access_level&preferences'

<div ui-view="{{myView}}"></div>

---

因此，给定我们的/settings？access_level=admin&preferences=shop的url，我们得到的myView将=admin@ecoApp.nav.not.tools.settings并且可以使用开关/ifs更改新参数。

如果有人跟不上，请让我知道，我会立即处理。