你好我试图动态生成状态:
这是我的js:
var $urlRouterProviderRef = null;
var $stateProviderRef = null;
angular.module('acadb', [
'ui.router',
'ui.bootstrap',
'flow',
'acadb.controllers',
'acadb.services',
'acadb.filters',
'acadb.directives',
'xeditable',
'ngResource',
])
.config(function($locationProvider,$stateProvider, $urlRouterProvider) {
$urlRouterProviderRef = $urlRouterProvider;
$locationProvider.html5Mode(false);
$stateProviderRef = $stateProvider;
}).run(['$q', '$rootScope', '$state', '$http','$stateParams',function ($q, $rootScope, $state, $http, $stateParams)
{
$rootScope.$state = $state;
$rootScope.$stateParams = $stateParams;
$http.get("/columns/user")
.success(function(data)
{
var data = [{
"name": "form",
"url": "/form",
"controller": 'formController',
"parent": "",
"abstract": false,
"templateUrl": '../partials/form/form.html',
"views": [{
"name": "personalInfo",
"url": '/personalInfo',
"templateUrl": '../partials/form/personalInfo.html'
}, {
"name": "education",
"url": '/education',
"templateUrl": '../partials/form/education.html'
}]
}];
angular.forEach(data, function (value, key)
{
var state = {
"templateUrl":value.templateUrl,
"url": value.url,
"parent" : value.parent,
"controller": value.controller ,
"abstract": value.abstract,
"views": {}
};
console.log(state);
angular.forEach(value.views, function (view)
{
state.views[view.name] = {
templateUrl : view.templateUrl,
name: value.name+'.'+view.name
};
});
$stateProviderRef.state(value.name, state);
//console.log( $stateProviderRef.state(value.name, state));
});
$state.go("form");
});
}]);
在我的主HTML中:
<div ui-view=""></div>
form.html:
<form id="signup-form" ng-submit="processForm()
<div id="form-views" ui-view=""></div>
</form>
但由于某种原因,内容根本没有显示。我可以在检查员看到所有部分都正确到达。
我错过了什么?
仅供参考 - 这是一个非动态状态配置,工作正常:
// .state('form', {
// url: '/form',
// templateUrl: '../partials/form/form.html',
// controller: 'formController'
// })
//
// // nested states
// // each of these sections will have their own view
// // url will be nested (/form/profile)
// .state('form.personalInfo', {
// url: '/personalInfo',
// templateUrl: '../partials/form/personalInfo.html'
// })
//
// // url will be /form/interests
// .state('form.education', {
// url: '/education',
// templateUrl: '../partials/form/education.html'
// })
//
// // url will be /form/payment
// .state('form.skills', {
// url: '/skills',
// templateUrl: '../partials/form/skills.html'
// });
//
// catch all route
// send users to the form page
$urlRouterProvider.otherwise('/form/personalInfo');