AngularJS-如何在状态解析功能中获取状态名称以加载控制器文件？

Question

我正在逐步探索使用PHP的第一个完整AngularJS应用程序，并针对以api为中心的方法进行了量身定制。我已经达到了这一点：我希望能够在下面的$ stateProvider中捕获状态名称，以便传递给加载功能。但是，我无法使$ rootScope.statename变为未定义状态。我已将其从解决方案中删除，因为我无法获取它来帮助从加载功能警报语句中删除未定义的内容。如何捕获（risk或actionitem）为所需的状态名称才能传递给load函数？app.js-删除了代码段app.run( ['$rootScope', '$state', '$stateParams',                      function ($rootScope,   $state,   $stateParams) {                           $rootScope.statename = $state.current; }]);app.jsangular.module('Action', ['datatables', 'datatables.scroller', 'ngResource']);          angular.module('Risk',   ['datatables', 'datatables.scroller', 'ngResource']);          var app = angular.module('Main', ['ui.router', 'oc.lazyLoad', 'datatables', 'ngResource', 'Action', 'Risk']);app.config(['$ocLazyLoadProvider', '$stateProvider', '$urlRouterProvider', function($ocLazyLoadProvider, $stateProvider, $urlRouterProvider){    configRoutes($stateProvider, $urlRouterProvider, $ocLazyLoadProvider);}]);route-config.jsfunction load ($ocLazyLoad, $q, $rootScope){    var deferred = $q.defer();    try{        $ocLazyLoad.load($rootScope.statename).then(function(){            deferred.resolve();        });    }    catch (ex){        deferred.reject(ex);    }    return deferred.promise;}function configRoutes($stateProvider, $urlRouterProvider, $ocLazyLoadProvider){    $urlRouterProvider        .when('action', 'action')        .when('issue',  'issue')        .when('lesson', 'lesson')        .when('opportunity', 'opporutnity')        .when('risk', 'risk')        .otherwise('main');    $ocLazyLoadProvider.config({        modules:         [{            name: 'action',            files: ['app/tool/action/ActionController.js']        },        {            name: 'risk',            files: ['app/tool/risk/RiskController.js']        }]    });    $stateProvider        .state('main', {            url: "/main",            //templateUrl: '/app/tool/home/home.html',        });

Answer 1

只需保持简单的代码即可：

 $stateProvider

    .state('action', {

        name: 'action', //<--state name I want to capture for this url 

        url: "/actionitems",

        resolve: {

            loadDependencies: function($ocLazyLoad) {

                return $ocLazyLoad.load("action");

            }

        },

        templateUrl: '/app/tool/action/ActionItems.html'

 });

Answer 2

我将allowed方法添加到了resolve部分，并清理了代码以得到所需的结果。我声明了一个全局状态以获取其中的价值$state$.name

var state = '';

//route-config.js

function load($ocLazyLoad, $q)

{

    var deferred = $q.defer();

    try

    {

        $ocLazyLoad.load(state).then(function ()

        {

            deferred.resolve();

        });

    }

    catch (ex)

    {

        deferred.reject(ex);

    }

    return deferred.promise;

}

function configRoutes($stateProvider, $urlRouterProvider, $ocLazyLoadProvider)

{

    var res = 

    {

        loadDependencies: ['$ocLazyLoad', '$q', load],

        allowed: function ($state$)

        {

            state = $state$.name;

        }

    };

    $urlRouterProvider

        .when('action', 'action')

        .when('issue', 'issue')

        .when('lesson', 'lesson')

        .when('opportunity', 'opporutnity')

        .when('risk', 'risk')

        .otherwise('main');

    $ocLazyLoadProvider.config(

    {

        modules: [

        {

            name: 'action',

            files: ['app/tool/action/ActionController.js']

        },

        {

            name: 'risk',

            files: ['app/tool/risk/RiskController.js']

        }]

    });

    $stateProvider

       .state('action',

        {

            url: "/actionitems",

            resolve: res,

            templateUrl: '/app/tool/action/ActionItems.html'

        });

    $stateProvider

        .state('risk',

        {

            url: "/risks",

            resolve: res,

            templateUrl: '/app/tool/risk/Risks.html'

        });

}