Я делаю все возможное, чтобы погрузиться в свое первое полное приложение AngularJS, использующее PHP и адаптированное к подходу, ориентированному на API.
Я достиг этого момента:
Я хочу иметь возможность зафиксировать имя состояния внутри $stateProvider ниже для передачи функции загрузки. Однако я не могу заставить $rootScope.statename быть чем-то другим, кроме неопределенного. Я удалил это из своего решения, потому что не смог заставить его помочь удалить undefined из оператора предупреждения функции загрузки.
Как мне зафиксировать (risk
или actionitem
) в качестве желаемого имени состояния, чтобы иметь возможность перейти к функции load
?
app.js — удален фрагмент кода
app.run( ['$rootScope', '$state', '$stateParams',
function ($rootScope, $state, $stateParams) {
$rootScope.statename = $state.current;
}]);
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);
}]);
маршрут-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
имеет всю информацию о текущем состоянии, включая имя. Итак, $state.current.name
предоставит вам необходимую информацию.
Просто сделайте код простым:
$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'
});
Я добавил allowed: function ($state$){state = $state$.name;}
, чтобы установить переменную глобального состояния. Затем я использую переменную состояния загрузки в методе загрузки.
Я постараюсь упростить код, но я ценю ответ!
Я добавил метод allowed
в раздел разрешения и очистил код, чтобы получить желаемый результат. Я объявил глобальное состояние, чтобы зафиксировать значение в $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'
});
}
$rootScope.statename остается пустой строкой в методе загрузки после внесения изменений для использования $state.current.name в app.run