從json文件/ http創建狀態

我有一個後端生成一個包含有關最重要頁面的信息的json文件。我想加載這個json文件，並根據文件中的數據建立相應的狀態。我無法將$ stateProvider注入到.run或.controller中，並且我無法將$ http注入到.config中，所以我感覺有點失落。從json文件/ http創建狀態

所以問題是。我如何加載json文件，根據這些數據瀏覽數據並建立狀態？

快速編輯：如果我缺乏提供必要的信息，請告訴我，我會嘗試改進問題。

來源

2014-10-10 user2215771

我試圖解決類似的問題，並創建了UI路由器附加「未來的狀態」。未來狀態會嘗試解決其他問題，例如使用RequireJS的延遲加載，整個卸載模塊的佔位符，以及通過書籤URL來路由未加載的佔位符。

這裏是一個普拉克演示如何使用未來各國你的使用情況：http://plnkr.co/edit/Ny7MQcmy35dKeEjbw57d?p=preview

我嘗試使用計算器段亞軍，但出了問題，所以這裏是代碼的非可運行糊。

JS：

// Code goes here 

var app = angular.module("jsonstates", ["ct.ui.router.extras"]); 

app.config([ '$stateProvider', '$futureStateProvider', 
function($sp, $fsp) { 
    var futureStateResolve = function($http) { 
    return $http.get("states.json").then(function(response) { 
     angular.forEach(response.data, function(state) { 
     $sp.state(state); 
     }) 
    }) 
    } 
    $fsp.addResolve(futureStateResolve); 
    console.log($fsp); 
}]); 

app.controller("someCtrl", function() { })

HTML：

<!DOCTYPE html> 
<html> 

    <head> 
    <script data-require="[email protected]" data-semver="1.2.25" src="https://code.angularjs.org/1.2.25/angular.js"></script> 
    <script src="https://rawgit.com/angular-ui/ui-router/0.2.11/release/angular-ui-router.js"></script> 
    <script src="https://rawgit.com/christopherthielen/ui-router-extras/0.0.10/release/ct-ui-router-extras.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
    </head> 

    <body ng-app="jsonstates"> 
    <h1>Hello Plunker!</h1> 
    <a href="#/top">Top state</a> <a href="#/top/nested">Nested state</a> 
    <div ui-view></div> 
    </body> 

</html>

JSON：

[ 
    { 
    "name": "top", 
    "url": "/top", 
    "controller": "someCtrl", 
    "template": "<h1>top state</h1><div ui-view></div>" 
    }, 
    { 
    "name": "nested", 
    "parent": "top", 
    "url": "/nested", 
    "controller": "someCtrl", 
    "template": "<h1>nested state</h1><div ui-view></div>" 
    } 
]

來源

2014-10-10 16:03:59

將未來狀態之前直接訪問的狀態時，這項工作已經被加載？示例website.com/nested在您的json中。 – user2215771 2014-10-15 07:27:10

是的，未來狀態會延遲UI路由器的路由，直到解決所有的$ fsp.addResolve承諾。 – 2014-10-15 14:13:47

這與我所尋找的非常接近，除非我需要使用templateURL，所以我可以從$ templateCache加載，而不是應用於模板屬性的內嵌html標記。還可以使用視圖將狀態定義爲抽象？任何想法如何我可以做到這一點，使用你已經證明了，感謝您的時間和耐心。我真的需要使用上述條件從json動態加載路由。 – 2014-10-21 14:06:48

從json文件/ http創建狀態

回答

相關問題