javascript - AngularJS - 如何使用 $routeParams 生成 templateUrl？

Question

我们的应用程序有 2 级导航。我们想使用 AngularJS $routeProvider为 <ng-view /> 动态提供模板.我正在考虑按照以下方式做一些事情:

angular.module('myApp', []).
config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/:primaryNav/:secondaryNav', {
        templateUrl: 'resources/angular/templates/nav/'+<<primaryNavHere>>+'/'+<<secondaryNavHere>>+'.html'
    });
}]);

我只是不知道如何填充 <<>> 中的部分.我知道 primaryNav 和 secondaryNav 已绑定(bind)到 $routeParams，但我如何在此处访问 $routeParams 以动态提供模板？

Answer 1

这个非常有用的特性现在从 AngularJS 1.1.2 版本开始可用。它被认为是不稳定的，但我已经使用它 (1.1.3) 并且工作正常。

基本上，您可以使用一个函数来生成一个 templateUrl 字符串。该函数传递了可用于构建和返回 templateUrl 字符串的路由参数。

var app = angular.module('app',[]);

app.config(
    function($routeProvider) {
        $routeProvider.
            when('/', {templateUrl:'/home'}).
            when('/users/:user_id', 
                {   
                    controller:UserView, 
                    templateUrl: function(params){ return '/users/view/' + params.user_id; }
                }
            ).
            otherwise({redirectTo:'/'});
    }
);

非常感谢https://github.com/lrlopez对于拉取请求。

https://github.com/angular/angular.js/pull/1524