在角UI路由器创建数组对象状态 [英] Create states from array object in Angular ui-router
本文介绍了在角UI路由器创建数组对象状态的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我能够从像这样的对象创建的状态...
VAR stateTest = {
名称：'2'，
观点：{
'视频'： {
templateUrl：'模板/ 2_video.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
};$ stateProvider.state（stateTest）;
但我需要做的是从阵列中创建的状态。这是我的尝试，它不工作。
VAR stateList = [
{
名称：3，
观点：{
'视频'： {
templateUrl：'模板/ 3.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
}，{
名称：'4'，
观点：{
'视频'： {
templateUrl：'模板/ 4.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
}
];$ stateProvider.state（stateList）;
然后我认为我需要尝试的foreach项的方法...
VAR stateList = [
{
名称：3，
templateUrl：'模板/ 3.html'，
控制器：'VideoCtrl'，
模板：'内容'
}，{
名称：'4'，
templateUrl：'模板/ 4.html'，
控制器：'VideoCtrl'，
模板：'内容'
}，
];stateList.forEach（函数（项目）{
VideoTest.stateProvider.state（项[0]，{
观点：{
'视频'： {
templateUrl：项目[1]
控制器：项目[2]
}，
内容：{
模板：项[3]
控制器：项目[2]
}
}
}）;
}）;
仍然没有很好的想法:(！？
------- ------编辑结果
克雷格在答复中指出，我的数组电话被顶了起来，但我也没有需要调用主模块，而只是把这个在模块的配置，像这样：
VideoTest.config（函数（$ stateProvider）{
VAR stateList = [
{
名称：3，
观点：{
'视频'： {
templateUrl：'模板/ 3.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
}，{
名称：'4'，
观点：{
'视频'： {
templateUrl：'模板/ 4.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
}
];stateList.forEach（函数（项目）{
$ stateProvider.state（item.name，{
观点：{
'视频'： {
templateUrl：item.views.video.templateUrl，
控制器：item.views.video.controller
}，
内容：{
模板：item.views.content.template，
控制器：item.views.content.controller
}
}
}）;
}）;}）;
解决方案
您与您的的forEach 的实施问题索引项目[0] 。在项目传递给的forEach 回调（即ARG [0]）本身就是这样索引这是一个数组中的元素没有意义。
您的数据：
VAR stateList = [
{
名称：3，
观点：{
'视频'： {
templateUrl：'模板/ 3.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
}，{
名称：'4'，
观点：{
'视频'： {
templateUrl：'模板/ 4.html'，
控制器：'VideoCtrl
}，
内容：{
模板：{{内容}}'，
控制器：'VideoCtrl
}
}
}
];
和状态设置：
stateList.forEach（函数（项目）{
VideoTest.stateProvider.state（item.name，{
观点：{
'视频'： {
templateUrl：item.views.video.templateUrl，
控制器：item.views.video.controller
}，
内容：{
templateUrl：item.views.content.templateUrl，
控制器：item.views.content.controller
}
}
}）;
}）;
I am able to create a state from an object like so...
var stateTest = {
name: '2',
views: {
'video': {
templateUrl: 'templates/2_video.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
};
$stateProvider.state(stateTest);
but what I need to do is create states from an array. This was my attempt and it is not working.
var stateList = [
{
name: '3',
views: {
'video': {
templateUrl: 'templates/3.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
},{
name: '4',
views: {
'video': {
templateUrl: 'templates/4.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
}
];
$stateProvider.state(stateList);
Then I thought I needed to try the foreach item approach...
var stateList = [
{
name: '3',
templateUrl: 'templates/3.html',
controller: 'VideoCtrl',
template: 'content'
},{
name: '4',
templateUrl: 'templates/4.html',
controller: 'VideoCtrl',
template: 'content'
},
];
stateList.forEach(function (item) {
VideoTest.stateProvider.state(item[0],{
views: {
'video': {
templateUrl: item[1],
controller: item[2]
},
'content': {
template: item[3],
controller: item[2]
}
}
});
});
Still no good :( Ideas!?
------- EDIT ------
As Craig pointed out in the answer, my array call was jacked up but I also didn't need to call the main module, but rather just place this in a module config like so:
VideoTest.config(function($stateProvider) {
var stateList = [
{
name: '3',
views: {
'video': {
templateUrl: 'templates/3.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
},{
name: '4',
views: {
'video': {
templateUrl: 'templates/4.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
}
];
stateList.forEach(function (item) {
$stateProvider.state(item.name,{
views: {
'video': {
templateUrl: item.views.video.templateUrl,
controller: item.views.video.controller
},
'content': {
template: item.views.content.template,
controller: item.views.content.controller
}
}
});
});
});
解决方案
Your problem with your forEach implementation is indexing the item[0]. The item passed to the forEach callback (i.e. arg[0]) is the element itself so indexing this as an array doesn't make sense.
Your data:
var stateList = [
{
name: '3',
views: {
'video': {
templateUrl: 'templates/3.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
},{
name: '4',
views: {
'video': {
templateUrl: 'templates/4.html',
controller: 'VideoCtrl'
},
'content': {
template: '{{content}}',
controller: 'VideoCtrl'
}
}
}
];
and state setup:
stateList.forEach(function (item) {
VideoTest.stateProvider.state(item.name,{
views: {
'video': {
templateUrl: item.views.video.templateUrl,
controller: item.views.video.controller
},
'content': {
templateUrl: item.views.content.templateUrl,
controller: item.views.content.controller
}
}
});
});
这篇关于在角UI路由器创建数组对象状态的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
