2016-09-27 97 views
1

数据,而params我想加载dataparams每个状态时,一次从我的服务settings应用程序加载(因为数据异步加载该服务还返回promise)负载值。
事情是这样的:角UI路由器:从服务

.state('tutorials', { 
    url: '/tutorials', 
    templateUrl: 'partials/tutorials.html', 
    controller: 'TutorialsCtrl', 
    data: {details: false}, // instead of false I want: settings.get('tutorials_data_details') 
    params: {popular: '512'} // instead of '512' I want: settings.get('tutorials_params_popular') 
    }) 

那些params必须加载所有国家进入任何国家,因为它们被用来建立与ui-sref指令,它可以放置在任何html指向任何国家(包括那些默认的链接之前将使用params)。

问题是我不能将service注入config函数。并且使用resolve不会一次处理所有状态。

我认为$stateProvider.decorator可以使用,但我不知道如何。

回答

0

我会评论,但没有足够的声誉。

如果有可能,一个选择是创建一个父抽象状态如app,所以你的状态树将成为app.tutorials然后你就可以在app状态下使用resolve,允许所有子状态使用的数据/ PARAMS。

是这样的:

.state('app', { 
url: '', 
abstract: true, 
templateUrl: 'partials/tutorials.html', 
controller: 'AppCtrl', 
resolve: { <resolve your dependencies here> } 
}) 

.state('app.tutorials', { 
    url: '/tutorials', 
    templateUrl: 'partials/tutorials.html', 
    controller: 'TutorialsCtrl' 
}) 

注意教程状态不会加载,直到决心完成。

0

一些研究和思考后,我来到了这3个可能的解决方案:

1)使用decorator我们做的所有国家解决settings服务。

.decorator('data', function(state, parent) { 
    state.resolve.SettingsLoaded = ['settings', function(settings) { return settings.$promise; }]; 
    return parent(state); 
}) 

然后在settings服务使用负载成功回调设置状态。您可以使用$state.get()获取所有状态(或使用string参数按名称获取特定状态)并修改params对象。
注意,你不能使用短版本,如state.params.popular = '512',但完整的:state.params.popular.value = '512'

2)那些params可能实际上是将被注入和调用的函数,并且将使用结果值。 所以在stateparams的定义是:

params: {popular: ['settings', function(settings) { return settings.get('tutorials_params_popular') || '512'; }]} 

此外,我再次使用相同decorator,以确保在加载任何状态之前settings将得到解决。
我最喜欢这种方法,因为所有参数值都保留在settings服务中,并且正在动态反映更改。

3)由于我使用RequireJS,我可以使用它加载设置,然后将其注入路由器文件。然而,这将需要对settings服务中的代码进行更多更改...