Могу ли я динамически создавать маршруты в AngularJS из вызова API?

Question

Я изучаю AngularJS и предполагаю, что это возможно, и каков наилучший способ динамического создания маршрутов на основе результатов вызова API?

У меня есть контроллер, который возвращает массив папок:

controllers.controller('FoldersCtrl', function($scope, $http) { 
    $http.jsonp('https://api....=JSON_CALLBACK').then(function (shaggy){ 
    $scope.list=shaggy.data; 
}); 

Я видел несколько примеров $routeProvider, которые выглядят примерно так:

app.config(function ($routeProvider) { 
    $routeProvider 
    .when('/somePath', {controller:"SomePathCtrl", templateUrl: "partials/somePath.html" }) 
    .otherwise({redirectTo: "/homePath"}) 
}); 

Но я еще встречу пример, где '/somePath' получен из результата вызова API. Я хотел бы сделать что-то вроде этого:

app.config(function ($routeProvider) { 
    $routeProvider 
    .when({{shaggy.data.folder}}, {controller:"FolderCtrl", templateUrl: "partials/folder.html" }) 
    .otherwise({redirectTo: "/homePath"}) 
}); 

Тогда в идеале, как FolderCtrl и partials/folder.html будет заселен с кодом достаточно общим для отображения объектов в каждой папке, так что некоторые как бы должно быть осведомлены о {{shaggy.data.folder}} что я перешел на маршрут. Есть предположения?

Заранее спасибо.

Answer 1

$routeProvider может быть сконфигурирован только в конфигурационном модуле модуля, который будет запускаться раньше всего в этом модуле (например, в службах или контроллерах).

Одним из способов вы могли бы добиться этого использовать кетчуп все маршрут:

$routeProvider.when('/:somePath*', ...) 

и использовать $ routeParams эмулировать поведение.

Ослабленный (теоретический) пример:

.controller('RouteController', function($routeParams) { 
    this.viewPath = $routeParams.showPath + '.html'; // or some way to map routes to views. 
}); 

<div ng-controller="RouteController as routeCtrl"> 
    <div ng-include="{{routeCtrl.viewPath}}"></div> 
</div> 

У нас есть (не с открытым исходным кодом) приложение, где мы создаем переменную JS с информацией о маршрутизации во время страницы исходного сервера визуализации, что-то вроде:

<script>var ROUTES = <% routes %>;</script> 

где routes - это дамп JSON карты с сервера (пропуск API-вызова от JS). Затем мы просто установили $routeProvider:

.config(function($routeProvider) { 
    angular.forEach(JSON.parse(ROUTES), function(view, route) { 
    $routeProvider.when(route, {templateUrl: view}); 
    }); 
})