[英]Angular 2, TypeScript & ui-router - How to get state params
[英]Load Controller based on state params using Angular ui-router
我正在嘗試加載基於stateparam的控制器,以使其可重用
.state("dashboard.item.detail", {
url: "/detailId/:detailId/detailName/:detailName",
views: {
'main@': {
templateUrl: function ($stateParams){
//move this to a util function later
var tempName = unescape($stateParams.detailName);
tempName = tempName.replace(/\s/g, "-");
return '../partials/slides/' + tempName + '.html';
},
resolve: {
DetailData: ['DetailService', function(DetailService){
return DetailService.getDetails();
}]
},
controller: function ($stateParams) {
console.log( $stateParams.detailName + 'Ctrl');
return $stateParams.detailName + 'Ctrl';
}
}
}
})
調節器
.controller('NemtCtrl', ['$scope', '$rootScope', 'DetailData', function ($scope, $rootScope, detailData) {
console.log(detailData);
}]);
如果我刪除該功能並且只是使用(控制台將記錄detailData),控制器將工作
controller: 'NemtCtrl'
但如果我這樣做,將不起作用:
controller: function ($stateParams) {
return 'NemtCtrl';
}
我在這做錯了什么? 有一個更好的方法嗎?
這里發生的是當你寫這個:
controller: 'NemtCtrl'
你告訴angular獲得名為'NemtCtrl'的控制器。 但是當你另一方面寫下這個:
controller:
function ($stateParams) {
return 'NemtCtrl';
}
你正在為那個州定義一個控制器。
更新
根據ui-router文檔,方法如下:
$stateProvider.state('contacts', {
template: ...,
controllerProvider: function($stateParams) {
var ctrlName = $stateParams.type + "Controller";
return ctrlName;
}
})
你可以在這里閱讀更多相關信息
更新2
對於你的情況,它將是這樣的:
.state("dashboard.item.detail", {
url: "/detailId/:detailId/detailName/:detailName",
views: {
'main@': {
templateUrl:
function ($stateParams){
//move this to a util function later
var tempName = unescape($stateParams.detailName);
tempName = tempName.replace(/\s/g, "-");
return '../partials/slides/' + tempName + '.html';
},
resolve: {
DetailData: ['DetailService',
function(DetailService){
return DetailService.getDetails();
}]
},
controllerProvider: //Change to controllerProvider instead of controller
function ($stateParams) {
//console.log( $stateParams.detailName + 'Ctrl');
return $stateParams.detailName + 'Ctrl';
}
}
}
})
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.