current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Join the Stack Overflow Community
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.
Join them; it only takes a minute:
Sign up
up vote 0 down vote favorite

Can someone explain how I can route to a Url using parameters?

E.g. id like to click on a product and open more info of the product by Id.

My Routing so far ...

        angular.module('shop', ["customFilters", "cart", "ngRoute"])
        .config(function ($routeProvider){

            $routeProvider.when("/complete", {
                templateUrl: "../app/views/orderComplete.html"
            });

            $routeProvider.when("/placeorder", {
                templateUrl: "../app/views/placeOrder.html"
            });

            $routeProvider.when("/checkout", {
                templateUrl: "../app/views/checkoutSummary.html"
            });

            $routeProvider.when("/products", {
                templateUrl: "../app/views/productList.html"
            });

            $routeProvider.when("/product:", {
                templateUrl: "../app/views/product.html"
            });

            $routeProvider.otherwise({
                templateUrl: "../app/views/productList.html"
            });

        });

So By clicking ...

<a class="btn btn-default" href="#/product/{{item.id}}">More Info</a>

Id like to be routed to product/{{id}}.html ...

Can someone advise what I am missing in ...

       $routeProvider.when("/product:id", {
            templateUrl: "../app/views/product.html"
        });
share|improve this question
up vote 1 down vote accepted

2 things, but you are basically there.

First you are missing a slash before the URL param. Happens to the best of us.

routeProvider.when("/product/:id", {
    templateUrl: "../app/views/product.html"
});

Secondly you should use ng-href instead href when you have dynamic URL params.

<a ng-href="#/product/{{item.id}}">More Info</a>
share|improve this answer
    
Thanks dude, an extra pair of eyes is always the key after hours on coding. Appreciate the help @enzey! – ClarkySmiverz77 5 hours ago
up vote 0 down vote

I thinks this issue is duplicate, see response How to pass parameters using ui-sref in ui-router to controller

you can send paramters to state name as home({foo: 'fooVal1', bar: 'barVal1'}) with a url '/:foo?bar' see this exemple:

$stateProvider
    .state('home', {
      url: '/:foo?bar',
      views: {
        '': {
          templateUrl: 'tpl.home.html',
          controller: 'MainRootCtrl'

        },
        ...
      }

and send values as:

<a ui-sref="home({foo: 'fooVal1', bar: 'barVal1'})">
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.