user2217057
user2217057

Reputation: 237

Angular UI-Router, unable to pass the third parameter

I am using Angular UI-router for navigation and also passing parameters from view to view, but I am unable to figure out why passing the third parameter in my code fails. The simplified code below works fine with two parameters, but as soon as I add the third one, then the navigation fails: when I click on the link, simply nothing happens - no errors, when I take the third parameter out - everything works fine. Any help is appreciated.

.state('page.details', {
        url: '^/child-page/{id1:int}/{name}',
        views: {
            '@': {
                templateUrl: '/child-page.html',
                controller: 'ChildCtrl'
            }
        }
    })


<a href="#" ui-sref="page.details({id1:5, name:somename})">

Now when I add the third parameter, the navigation fails:

url: '^/child-page/{id0:int}/{id1:int}/{name}'
<a href="#" ui-sref="page.details({id0:3, id1:5, name:somename})">

EDIT: It turned out the problem was a syntax error, but not caused by third parameter itself. In the actual working code there was a left-over quotation mark on one side of the URL in HTML that was misleading the UI router. The router was assuming that the provided URL was valid and was trying to load the resource. Then not finding it, the default view was being loaded instead. Once the quotation mark was taken out, the third parameter started showing up in the child view. Appreciate for having taken a look to help.

Upvotes: 0

Views: 63

Answers (1)

Jeffrey Coleman
Jeffrey Coleman

Reputation: 188

How about something like thismaybe:

url: '^/child-page/:id0/:id1/:name'

Upvotes: 1

Related Questions