[英]AngularJS - How do I get the state name inside of state resolve function to load controller files?
I am making head ways into diving into my first complete AngularJS app using PHP and tailored toward an api-centric approach. 我正在逐步探索使用PHP的第一个完整AngularJS应用程序,并针对以api为中心的方法进行了量身定制。
I have reached this point: 我已经达到了这一点:
I want to be able to capture the state name inside $stateProvider below for purpose of passing to load function. 我希望能够在下面的$ stateProvider中捕获状态名称,以便传递给加载功能。 However I am unable to get $rootScope.statename to be anything but undefined.
但是,我无法获得$ rootScope.statename,但未定义。 I have removed this from my solution because I could not get it to help remove undefined from the load function alert statement.
我已将其从解决方案中删除,因为无法获取它以帮助从加载功能警报语句中删除未定义的内容。
How do I capture ( risk
or actionitem
) as the desired state name to be able to pass to the load
function? 如何捕获(
risk
或操作actionitem
)作为所需的状态名称,以便能够传递给load
功能?
app.js -Removed code snippet app.js-删除了代码段
app.run( ['$rootScope', '$state', '$stateParams',
function ($rootScope, $state, $stateParams) {
$rootScope.statename = $state.current;
}]);
app.js app.js
angular.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.js route-config.js
function 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',
});
$stateProvider
.state('action', {
name: 'action', <----------------------state name I want to capture for this url
url: "/actionitems",
resolve: {
loadDependencies: ['$ocLazyLoad', '$q', '$rootScope', load]
},
templateUrl: '/app/tool/action/ActionItems.html'
});
$stateProvider
.state('risk', {
name: 'risk', <----------------------state name I want to capture for this url
url: "/risks",
resolve: {
loadDependencies: ['$ocLazyLoad', '$q', '$rootScope', load]
},
templateUrl: '/app/tool/risk/Risks.html'
});
}
$state.current
has all the information about the current state, including the name. $state.current
包含有关当前状态的所有信息,包括名称。 So $state.current.name
will get you the information you need. 因此,
$state.current.name
将为您提供所需的信息。
Just keep the code simple: 只需保持代码简单即可:
$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'
});
I added the allowed
method to the resolve section and cleaned up the code to get the desired outcome. 我在resolve部分中添加了
allowed
方法,并清理了代码以获得所需的结果。 I declared a global state to capture the value in $state$.name
我声明了一个全局状态以捕获
$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'
});
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.