javascript - AngularJS-具有UI路由器 View 和$ ocLazyLoad的动态$ StateProvider解析语法

我目前有一个很好的静态版本，可以问到我的问题。问题是，当尝试在循环中使用$ StateProvider时，我似乎无法正确格式化JSON。我不确定哪个部分的格式不正确会导致“未定义的不是函数”错误。但是下面是我的带有视图的静态状态定义，并使用$ ocLazyLoad进行了解析。这行得通，真的不确定为什么我的JSON版本在循环中不起作用吗？

工作静态版本-绝对适合我

// ABSTRACT APP LAYOUT - VIEW THAT DEFINES ENTIRE LAYOUT STRUCTURE
$stateProvider
    .state('app', {
        abstract: true,
        controller: 'LayoutCtrl',
        templateUrl: 'app/components/core/layout/layout.html'

    });

// VIEWS
// CURRENT LAZY LOADING WAS REFERENCED FROM HERE - https://egghead.io/lessons/angularjs-lazy-loading-modules-with-ui-router-and-oclazyload
$stateProvider
    .state('app.dashboard', {
        views: {
            'feature': {
                templateUrl: 'lazyload/components/core/features/dashboard/dashboard.html',
                controller: "DashboardCtrl as dashboard",
                resolve: {
                    dashboard: function ($ocLazyLoad) {
                        return $ocLazyLoad.load(
                            {
                                name: "dashboard",
                                files: ["lazyload/components/core/features/dashboard/dashboard-controller.js"]
                            }
                        )
                    }
                }
            }
        }
    })
    .state('app.other-feature', {
        views: {
            'feature': {
                templateUrl: 'lazyload/components/core/features/other-feature/other-feature.html',
                controller: "OtherFeatureCtrl as otherFeature",
                resolve: {
                    otherFeature: function ($ocLazyLoad) {
                        return $ocLazyLoad.load(
                            {
                                name: "otherFeature",
                                files: ["lazyload/components/core/features/other-feature/other-feature.js"]
                            }
                        )
                    }
                }

            }
        }
    });

我想明确一点，静态版本确实有效，这是我似乎无法正常工作的循环版本。也许我没有为函数正确地执行某种数组标记或其他操作？任何帮助是极大的赞赏！

最佳答案

我实际上已经开始工作了，并希望共享答案和代码格式，以防万一有人感兴趣地看到一个带有循环的工作独立数组，该循环添加了一个抽象状态和子状态以及带有视图的子视图，该视图使用了动态解析懒惰加载控制器和文件的方法。路由是通过$ ocLazyLoad模块加载的。

我认为仅此代码可能会帮助外面的人比我少挣扎。

var states = [
    { "name": "app", "abstract": true, "url": "", "templateUrl": "app/components/core/layout/layout.html", "controller": "LayoutCtrl" },
    {
        "name": "app.dashboard",
        "views": {
            "feature": {
                "templateUrl": "lazyload/components/core/features/dashboard/dashboard.html",
                "controller": "DashboardCtrl as dashboard",
                "resolve": {
                    "dashboard": function ($ocLazyLoad) {
                        return $ocLazyLoad.load(
                            {
                                "name": "dashboard",
                                "files": ["lazyload/components/core/features/dashboard/dashboard-controller.js"]
                            }
                        )
                    }
                }
            }
        }
    },
    {
        "name": "app.associations_hospital-surgeon",
        "views": {
            "feature": {
                "templateUrl": "lazyload/components/core/features/other-feature/other-feature.html",
                "controller": "OtherFeatureCtrl as otherFeature",
                "resolve": {
                    "otherFeature": function ($ocLazyLoad) {
                        return $ocLazyLoad.load(
                            {
                                "name": "otherFeature",
                                "files": ["lazyload/components/core/features/other-feature/other-feature.js"]
                            }
                        )
                    }
                }
            }
        }
    }
];

angular.forEach(states, function (state) {
    console.log('state --------------------------------------------------------------------------');
    console.log(state);
    $stateProvider.state(state.name, state);
});

在这里，我装饰了JSON，以便可以从服务器上加载它，但是由于函数在JSON文件中无效，因此这似乎对我有用，因为使用了自定义数据属性来定义使用时附加的函数。这使我可以从外部或从服务器加载文件，并且在需要时仍可以通过$ ocLazyLoad将lazyload作为函数使用。

var states = [
    { "name": "app", "abstract": true, "url": "", "templateUrl": "app/components/core/layout/layout.html", "controller": "LayoutCtrl" },
    {
        "name": "app.dashboard",
        "views": {
            "feature": {
                "templateUrl": "lazyload/components/core/features/other-feature/other-feature.html",
                "controller": "DashboardCtrl as dashboard",
                "resolve": {},
                "data": {
                    "controllerAlias": "dashboard",
                    "controllerFiles": ["lazyload/components/core/features/other-feature/other-feature.js"]
                }
            }
        }
    },
    {
        "name": "app.associations_hospital-surgeon",
        "views": {
            "feature": {
                "templateUrl": "lazyload/components/core/features/associations/other-feature.html",
                "controller": "OtherFeatureCtrl as otherFeature",
                "resolve": {},
                "data": {
                    "controllerAlias": "otherFeature",
                    "controllerFiles": ["lazyload/components/core/features/other-feature/other-feature.js"]
                }
            }
        }
    }
];

angular.forEach(states, function (state) {
    console.log('state --------------------------------------------------------------------------');
    try{
        console.log(state.views.feature.resolve);
        state.views.feature.resolve[state.views.feature.data.controllerAlias] = function($ocLazyLoad){return $ocLazyLoad.load({"name": state.views.feature.data.controllerAlias,"files": state.views.feature.data.controllerFiles})};
    }catch(e){

    }

    $stateProvider.state(state.name, state);
});