AngularJS反向路由

Question

除了在href屬性中對URL進行硬編碼之外，是否有方法通過$ routeProvider獲取URL附加到控制器？如果修改$ routeProvider中的路由，則必須修改模板中所有硬編碼的URL，這些URL效率不高。

例如，Django Framework提供了「reverse()」實用功能和「url」模板標籤，它給出了「控制器」（視圖函數）以及它返回關聯URL的URL參數。

Answer 1

是的，但沒有內置的方法來做到這一點。因爲即使控制器可能綁定到$ routeProvider，它也不需要。實現它的一種方法是讓所有控制器都從BaseController繼承。此BaseCtrl將屬性「currentUrl」注入到作用域中。

myApp.controller("BaseCtrl" ,function ($scope, $location) { 

    }); 

    myApp.controller("AnyCtrl" ,function ($scope, $location) {  

    //inherit from base 
    $injector.invoke(function ($controller) { $controller('BaseCtrl', {$scope: $scope}); }); 

    }); 

的另一種方式，通過改變$ rootScope.currentUrl每個路徑已經改變的時間來實現它爲「污染」（因此不是一個很好的主意，但將工作）的$ rootScope。由於所有作用域都從$ rootScope繼承，所以變量$ scope.currentUrl將始終可用並且最新到您想要的任何視圖中。

Answer 2

沒有內置的方法來做到這一點，但你可以使用angular.named-routes，它提供了反向URL。

$ routeProvider：

$routeProvider.when("/product/:id/:slug", { 
    templateUrl: "/product.html", 
    controller: "ProductController", 
    name: "product-detail" 
}); 

$locationProvider.html5Mode(true); 

$範圍

{product: {id: 1, name: "Awesome Product", slug: "awesome-product"}} 

做從模板反向：

<a data-named-route="product-detail" data-kwarg-id="{{ product.id }}" data-kwarg-slug="{{ product.slug}}">{{ product.name }}</a> 

應該變成：

<a href="/product/1/awesome-product">Awesome Product</a>