我正在尝试以下代码,但没有成功:
MyApp.config(['$routeProvider', '$provide', function($routeProvider, $provide) {
$routeProvider
.when('/', {
redirectTo: '/'
})
.when('/:page', {
templateUrl: function($routeParams) {
return 'views/'+ $routeParams.page +'.html';
},
})
.when('/:page/:child*', {
templateUrl: function($routeParams) {
return 'views/'+ $routeParams.page + '/' + $routeParams.child + '.html';
},
controller: function($routeParams) {
return $routeParams.child + '.' + $routeParams.page + 'Controller';
},
})
.otherwise({
redirectTo: '/'
});
}]);
我想要完成的是使用基于$ routParams变量的函数为每个视图定义控制器:
controller: function($routeParams) {
return $routeParams.child + '.' + $routeParams.page + 'Controller';
},
虽然它对templateUrl工作得很好,但是当我定义控制器时它似乎不起作用。
答案 0 :(得分:1)
实现这一目标的想法是,创建一个常量变量,将其分配给我们想要有条件加载的controller
内部,我们希望通过观察$routeParams
来设置控制器名称,因为我们可以注意$routeChangeStart
,因此我们将设置costants.controllerName
值,这将是控制器的名称。
你可以通过以下的方式实现这一目标。
<强>恒强>
MyApp.constant('constants',{
controllerName : ''
});
<强>配置强>
MyApp.config(['$routeProvider', '$provide','constants', function($routeProvider, $provide, constants) {
$routeProvider
.when('/', {
redirectTo: '/'
})
.when('/:page', {
templateUrl: function($routeParams) {
return 'views/' + $routeParams.page + '.html';
}
})
.when('/:page/:child*', {
templateUrl: function($routeParams) {
return 'views/' + $routeParams.page + '/' + $routeParams.child + '.html';
},
controller: constants.controllerName
})
.otherwise({
redirectTo: '/'
});
}]);
运行阻止
MyApp.run(['$rootScope', '$location', 'constants', '$routeParams',
function($rootScope, $location, constants, $routeParams) {
// register listener to watch route changes
$rootScope.$on("$routeChangeStart", function(event, next, current) {
constants.controllerName = $routeParams.child + '.' + $routeParams.page + 'Controller'; //set controller name on $routeChangeStart
});
}]);
我没试过这个,我相信这段代码应该有效,谢谢。