javascript - 将路由参数传递给 Controller

Question

现在我有现有的 productsController，它使用 dataService 提供产品数据

myApp.controller("productsController", function ($scope, $http, dataService) {
    $scope.productsData = dataService;    

    dataService.getProducts()
    .then(function () {
        //success

    },
    function () {
        // error
        alert("could not load products");
    });
});

这工作正常，产品在我的 View 中正确呈现。现在我想在产品点击上打开产品详细信息所以我添加

<tr ng-repeat="product in productsData.products">
    <td>{{ product.Name }}</td>           
    <td>
        <a ng-href="{{ product.Id }}">
            <img ng-src="{{ product.thumbnail }}" width="50" height="50" />
        </a>
    </td>
</tr>  

我添加了相应的路线

myApp.config(function ($routeProvider) {
    ...
    .when("/product/:id", {
        controller: "productsController",
        templateUrl: "/templates/productDetailsView.html"
    })
    ...
}

我的问题是:如何将此 id 参数传递给 productsController 以便我可以将其进一步传递给我的数据服务这将返回数据。

Answer 1

注入(inject)$routeParams进入你的 Controller 。

myApp.controller("productsController", ['$routeParams', function ($routeParams) {
    console.log($routeParams.id);         
}]);