将数据动态附加到 state.go 函数并在解析属性中检索 [英] Attach data dynamically to state.go function and retrieve in resolve property

问题描述

我有一个父状态:

.state('schoolyears', {
                url: '/schoolyears',
                views: {
                    'menu@': {
                        template: '<h1>Start your schoolyear action...</h1>'
                    },
                    'content@': {
                        templateUrl: "../views/schoolyear/schoolyears.html",
                        resolve: {
                            schoolyears: function (schoolyearService) {
                                return schoolyearService.getSchoolyears();
                            }
                        },
                        controller: 'SchoolyearsController'
                    }
                }
            })
.state('schoolyears.selected', {
                url: '/:id'
            })

和一个子状态:

 .state('schoolyears.selected.dates.day', {
                url: '/day/:year-:month-:day',
                views: {
                    '[e-mail]': {
                        templateUrl: '../views/lessonplanner/lessonplanner.day.html',
                        resolve: {
                            periods: function (periodService, $stateParams, $state) {
                                var schoolyearId = $stateParams.id;
                                var firstDayOfWeek = $state.current.data.firstDayOfWeek;
                                var periods = periodService.getPeriods(schoolyearId, firstDayOfWeek);
                                return periods;
                            }
                        },
                        controller: 'DateplannerDayController'
                    }
                }
            })

当我在 SchoolyearController.js 中打开一个学年时:

When I open a schoolyear in the SchoolyearController.js:

 $scope.open = function () {
        var entity = $scope.gridApi.selection.getSelectedRows()[0];
        var firstDayOfWeek = entity.firstDayOfWeek;
        $state.go('schoolyears.selected.dates.day', { id: $state.params.id}, {firstDayOfWeek: firstDayOfWeek}, {location: false, inherit: false});
    };

我想从选定的学年项目中传递 firstDayOfWeek，我想通过 $state.current.data.firstDayOfWeek 在 ui 路由器的解析中检索这个 firstDayOfWeek 值，但没有像 firstDayOfWeek 这样的变量.

I want to pass the firstDayOfWeek from the selected schoolyear item and I want to retrieve this firstDayOfWeek value inside the resolve of the ui router via $state.current.data.firstDayOfWeek but there is no such variable like firstDayOfWeek.

如何传递附加到 state.go 的数据并从 ui 路由器解析以正确加载数据?

How can I pass data attached to state.go and get it from the ui router resolve to load the data correctly?

推荐答案

如此处所述:解析，解析器的值可以是字符串或函数 - Factory.

As documented here: Resolve, the value of resolver could be string or a function - the Factory.

这意味着，我们确实可以访问我们需要的任何服务的 DI.而且，在 angularjs 世界中，服务 - 作为单例，是如何在应用程序中共享设置的最合适的方式.那将是我建议去的解决方案.调整后的 plunker，表明可以在此处找到该想法.

That means, that we do have access to DI of any Service we need. And also, in angularjs world, Service - as a singleton, is the most proprieate way how to share settings accross the application. That would be solution I would suggest to go. The adjusted plunker, showing that idea could be found here.

我们必须引入一项服务，例如设置

We would have to introduce a service, e.g. Setting

.factory('Settings', function(){
  return {
    firstDayOfWeek : null,
  };
})

我们还必须将该服务绑定到一些用户偏好:

We also have to bind that service to some user peferences:

.controller('SchoolyearsController', function($scope, Settings, schoolyears){
  $scope.Settings = Settings;
  ... 
  // bind the $scope.Settings.firstDayOfWeek to some selected value

在我们的解析器中:

  periods: function (Settings, $stateParams) {
    var periods = {
      year: $stateParams.id,
      firstDayOfWeek : Settings.firstDayOfWeek
    };
    return periods;
  }

检查此处.也许示例实现有点复杂，但我相信这里的想法应该很清楚

Check that here. Maybe the example implementation is a bit more complex, but I believe that idea here should be clear

这篇关于将数据动态附加到 state.go 函数并在解析属性中检索的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！