AngularJS中的路由參數

我正在使用Angular.js應用程序。它有7個「頁面」，組成關於反向鏈接的報告。主要的url看起來像http://www.site.com/report/#，所以'/'下面的第一條路線指向那個URL。AngularJS中的路由參數

我的問題是我想要在URL中的報告ID。所以像這樣的東西。 http://www.site.com/report/#/:reportId或http://www.site.com/report/#/99DF82A023FCE3515BE9A18F00908939F5A29D14。

我需要訪問該ID並以某種方式爲每個頁面進行存儲。所以在http://www.site.com/report/#/live我仍然需要訪問reportID。

我確定這是一件簡單的事情，但我是一個角度的noob。有人可以指點我的教程嗎？這是迄今爲止我所擁有的。

'use strict'; 

// Declare app level module which depends on filters, and services 
var ultModule = angular.module('ultimate-report', ['ngRoute', 'ngCookies', 'ngTable', 'ultimate.filters','ultimate.services','ultimate.directives','myApp.controllers', 'ultimate.config']); 

ultModule.config(['$routeProvider', function($routeProvider, $routeParams) { 
    $routeProvider 
     .when('/',   {templateUrl: '../partials/report/about.html', controller: 'CtrlReport'}) 
     .when('/live',  {templateUrl: '../partials/report/links-live.html', controller: 'CtrlLinksLive'}) 
     .when('/dead',  {templateUrl: '../partials/report/links-dead.html', controller: 'CtrlReport'}) 
     .when('/selected', {templateUrl: '../partials/report/links-selected.html', controller: 'CtrlReport'}) 
     .when('/patterns', {templateUrl: '../partials/report/patterns.html', controller: 'CtrlReport'}) 
     .when('/exports', {templateUrl: '../partials/report/export.html', controller: 'CtrlReport'}) 
     .when('/help',  {templateUrl: '../partials/report/help.html', controller: 'CtrlReport'}) 
     .otherwise({redirectTo: '/'}); 
}]);

來源

2013-12-20 RachelC

使用'$ rootScope'。你可以看到文檔[這裏]（http://docs.angularjs.org/api/ng.$rootScope）和一個好點的開始[這裏]（http://stackoverflow.com/questions/18880737/how-做-I-使用-rootscope合角度到存儲變量）。 – Beterraba

太棒了！我還沒有讀過run函數和rootScope。這將爲我節省一大筆頭痛，謝謝！ – RachelC

您希望遠離$ rootScope，因爲您不想過度使用自己的東西。更好的做一個Angular服務來存儲這些值。角度服務是全球單身人士，在這種情況下是完美的。 – NicolasMoise

那麼你真的想讓其他網址（例如http://www.site.com/report/#/live）沒有報告ID嗎？如果您在每個地址中都有參數（例如http://www.site.com/report/#/12334223287/live），則會更容易/更短。

儘管如此，我會創建我自己的服務（'ReportID'），只存儲報告ID。然後在您的控制器中包含$routeParams和ReportID（您的服務）作爲依賴關係。

app.controller('CtrlReport', ['$routeParams', 'ReportID', '$scope'], 
    function($routeParams, ReportID, $scope){ 
     ReportID.id = $routeParams.reportID; 
})

，並設置爲這種

.when('/report/:reportID', ...)

來源

2013-12-20 17:16:16 NicolasMoise

如果它在每個網址中都有id，那對我無關緊要。當我正在研究解決方案時，我意識到要始終保持它的存在會更容易一些。我只需要將它添加到菜單鏈接，以便當用戶點擊鏈接中的現場或死亡。 – RachelC

角ui-router是一個偉大的擴展Angular.js，可以很容易處理路由參數，嵌套視圖等

正如其他路線已經指出，將ID保存在所有頁面的url中是一個好主意 - 不要讓人們無法將頁面加書籤並直接回到查看同一視圖中的相同項目。

來源

2013-12-20 17:29:44

AngularJS中的路由參數

回答

相關問題