[英]AngularJS angular ui router - Pass custom data to controller
Following is my code: 以下是我的代码:
.state('tab.dash', {
url: '/dash',
views: {
'tab-dash': {
templateUrl: 'templates/tab1.html',
controller: 'QuestionsCtrl'
//,resolve: { type: '.net' }
}
}
})
.state('tab.friends', {
url: '/friends',
views: {
'tab-friends': {
templateUrl: 'templates/tab1.html',
controller: 'QuestionsCtrl'
//,resolve: { type: 'SQL' }
}
}
})
I want to pass aa different custom property to the above two routes since they use the same Controller and View, in order to differentiate it. 我想将一个不同的自定义属性传递给上面两个路由,因为它们使用相同的Controller和View,以区分它。 I have tried a hell lot of things.
我尝试了很多东西。 Please help how to do this!
请帮忙怎么做!
you can pass custom data as follows 您可以按如下方式传递自定义数据
.state('tab.dash', {
url: '/dash',
data: {
customData1: 5,
customData2: "blue"
},
views: {
'tab-dash': {
templateUrl: 'templates/tab1.html',
controller: 'QuestionsCtrl'
//,resolve: { type: '.net' }
}
}
})
.state('tab.friends', {
url: '/friends',
data: {
customData1: 6,
customData2: "orange"
},
views: {
'tab-friends': {
templateUrl: 'templates/tab1.html',
controller: 'QuestionsCtrl'
//,resolve: { type: 'SQL' }
}
}
})
In your controller, you can get the data value as follows 在控制器中,您可以按如下方式获取数据值
function QuestionsCtrl($state){
console.log($state.current.data.customData1);
console.log($state.current.data.customData2);
}
Read more about this topic here https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#inherited-custom-data 在这里阅读更多关于这个主题的信息https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views#inherited-custom-data
There are several options to do this, 有几个选项可以做到这一点,
For smaller data sets you could use the $cookieStore, for data that is under 4k Another option, especially with large data sets, would be to use Local Storage and then retrieve the data on page load/reload. 对于较小的数据集,您可以使用$ cookieStore,对于低于4k的数据。另一个选项,特别是对于大型数据集,将使用本地存储,然后在页面加载/重新加载时检索数据。 if it is only a very small amount of data, or data that is used through out multiple page you could use $rootscope, but this is not the best option as it just like polluting the global name space.
如果它只是非常少量的数据,或者通过多页使用的数据,你可以使用$ rootscope,但这不是最好的选择,因为它就像污染全局名称空间一样。 The last option, depending on how the data is retrieved, a service could be implemented, that is basically a singleton that can be passed to various angular scope.
最后一个选项,取决于如何检索数据,可以实现服务,这基本上是可以传递到各种角度范围的单例。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.