Angular UI-Router with dynamic URL

Question

I had my code working with ngRoute with no problems to load files by dynamic generate a URL for my views files:

.when('/page/:name*', {
        templateUrl: function(urlattr){
            return '/views/' + urlattr.name + '.view.html';
        },
        controller: 'PageController'
})

but then I got to move to UI Router in order to use nested views, but what is the equivalent of the above code with UI Router? I've tried the following code:

.state('home.pages', {
        url: "/page/:name*",
        controller: 'PageController',
        templateUrl: function(urlattr){
            return '/views/' + urlattr.name + '.view.html';
        }
});

and I'm getting the error

Could not resolve '/page/test' from state 'home'

In my anchor I'm trying to call it by the URL. The link comes from a database that knows URLs but not state names

<!-- I want to load '/views/test.view.html' file -->;
<a href="#/page/test">Link not working</a>
<div ui-view>nested view content</div>

do you have a parent state home? You are showing home.pages which would be child state of home — charlietfl
– charlietfl, Commented Jul 27, 2015 at 21:30
Where is the urlattr being passed in? I dont see query strings on the url. — GPicazo
– GPicazo, Commented Jul 27, 2015 at 21:36
it's not a query string. I want to take the substring after page/ from the URL. Example 'test.view.html' — nanndoj
– nanndoj, Commented Jul 27, 2015 at 21:39

GPicazo · Accepted Answer · 2015-07-27 21:31:45Z

2

Sounds like you are creating your anchor incorrectly. You should be doing something like

<a ui-sref="home.pages({param: value})">Link</a>

edited Jul 27, 2015 at 21:31

answered Jul 27, 2015 at 21:29

GPicazo

6,7263 gold badges23 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

charlietfl Over a year ago

that won't pass the url param though

GPicazo Over a year ago

I edited to allow passing params. If that is not what you mean, can you show your markup?

nanndoj Over a year ago

Is that a what to pass the URL instead of the state name? The link comes from a database that knows URLs but not state names

GPicazo Over a year ago

Yes, the normal way <a href="/page/test?param=value">Link</a> works. That is why I wanted to see what you were doing.

Collectives™ on Stack Overflow

Angular UI-Router with dynamic URL

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related