Question

我是一个角色的业余爱好者。我正在使用路由提供程序来加载单独的html页面和控制器。当我知道网站有哪些页面并且我可以定义它们时，这很好用。

app.config(function($routeProvider) {
    $routeProvider
        .when("/page1", {
            templateUrl: "../page1.html",
            controller: "Page1Ctrl"
        })
        .when("/page2", {
            templateUrl: "../page2.html",
            controller: "Page2Ctrl"
        })
        .when("/page3", {
            templateUrl: "../page3.html",
            controller: "Page3Ctrl"
        })
        .otherwise({
            redirectTo: "/page1"
        });
});

但是，将来可能会添加更多页面，我想为角度编写一种方法，以便将其转化为accout。喜欢的东西;

app.config(function($routeProvider) {

      (..figure out n...)

     $routeProvider
         .when("/page"+n, {
               templateUrl: "../page"+n+".html",
               controller: "Page"+n+"Ctrl"
         })
         .otherwise({
               redirectTo: "/page1"
         });
});

我无法弄清楚如何返回var列出当前页面，以便我可以删除＆＃39; / page＆＃39;将int操纵为n。

我尝试了控制台记录$routeProvider，但.when只返回一个函数。我不认为注入$scope是明智的，因为显然只使用$routeProvider传递var。

Answer 1

如果在路径中使用冒号（:)，Angular将解析它并用它填充$ routeParams，然后，在templateUrl中，而不是字符串，您可以使用返回模板URL的函数。只需在templateUrl函数中注入$ routeParams并构建您需要的url。

$routeProvider
  .when( '/page/:pageNumber', { 
      templateUrl: function ($routeParams) {
          return 'page_' + $routeParams.pageNumber + '.html'
      }
    })
 .otherwise( { redirectTo: '/page/1' } );

Here is a working fiddle。

$ routeProvider - 传递给.when的var在哪里存储

1 个答案: