编辑：

Question

我们正在考虑围绕角度构建我们的cms，我想知道是否有一种方法可以根据导入的json文件动态连接配置块中的路由。我们一直在使用$ routeProvider并列出这样的每个页面..

.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/home', {templateUrl: 'partials/home.html', controller: 'home'});
    $routeProvider.when('/archive', {templateUrl: 'partials/archive.html', controller: 'archive'});
}]);

对于更大的应用程序/网站来说，这有点不可用。我想要做的是基于json输入自动执行此过程。任何人都可以想到一个方法去做吗？我尝试创建服务，但只有提供程序可以注入配置块。提供者似乎并没有在配置区域中实际执行任何代码，只需设置一些选项，然后在应用程序生命周期中稍后调用该服务时执行这些选项。

Answer 1

另一种解决方案是在大多数路线上使用动态路由，我回答here

templateUrl属性可以接受传递routeParams的函数，因此这将通过命名约定启用直接路由。如果你有特定的长路线，你应该把它们放在这条小路上。

app.config(function ($routeProvider) {
  $routeProvider.when('/:page', {
    templateUrl: function(routeParams){
       return '/partials/'+routeParams.page+'.html';
    }
  })
});

请注意，控制器不能作为函数传递，因此我只需使用通常的ng-controller="" html属性将控制器包含在所包含部分的顶级元素中。

编辑：

如果您确实想要使用json配置，我建议您在应用程序配置javascript中内联它，而不是制作单独的http get，这将延迟重新加载时最早的用户导航。代码看起来类似于下面的coffeescript答案：

routes = [
  {route: "/home", vars: {templateUrl: "/partials/home", controller: "HomeCtrl"}},
  {...}
];

for(var i = 0; i < routes.length; i++) {
  $routeProvider.when(routes[i].route,routes[i].vars);
}

我还没有遇到过这个库，但是最好让你自己的解析器符合你的路由约定

Answer 2

只要将初始页面请求传递给应用程序，您就可以定义路由配置。这是因为需要在定义应用程序的同时定义路由配置。否则，Angular不会知道如何表现。运行config函数后也无法更改。我在这里用Plunk演示了它：

http://plnkr.co/edit/hKiWGib1ePuVISzXt4Wo?p=preview

您会注意到超时会复制对服务器的调用。当它在分配的时间后尝试修改$routeProvider配置时，对应用程序没有任何影响。为了从其他数据请求中获取配置，您首先必须确保在引导角度应用程序之前请求并接收路由信息。在我看来，这是糟糕的用户体验设计，因为用户在看到页面上的任何内容之前必须等待AJAX请求。

您可以从示例中删除的另一件事是我必须使用setTimeout而不是$timeout。这是因为您无法将服务注入config函数（这是出于此动态路由注入示例的原因）。

总而言之，归结为此。或者，使用页面提供路由配置，或者为Angular默认功能创建复杂而丑陋的解决方法。

angular $ routeProvider基于导入的json？

2 个答案:

编辑：