How to associate a unique ui-sref to every items in a dynamic list?

Question

I have a pagination system composed of items I retrieve from a JSON file. I can add/remove any of them. I want to associate to each of these items a link to a configuration view (each item has the same template but it has to have his own configuration). I'm looking for a proper way to do this using ui.router . Here's what my routing looks like :

app.js :

app.config(function ($stateProvider) {

        $stateProvider.state("itemslist", {
            url:"/itemslist",
            views: { 
                'launcher':{
                    controller:"ItemsListCtrl",
                    templateUrl:"ItemsList.html"
                }
            }
        })
        ...
}

And the html file :

ItemList.html :

<ul>
    <li ng-repeat="item in listItem">
        <b>{{item.text}} -</b>
        <button ui-sref="dynamic state">CONFIG.</button>
    </li>
</ul>

Here the 'dynamic state' could be something like "config?item.id". How would the routing work in this case ? Is this even possible ?

Answer 1

Use state params: https://github.com/angular-ui/ui-router/wiki/url-routing

ui-sref="config({itemId: item.id})"

$stateProvider.state("config", {
    url:"/itemconfig/:itemId",
    ...
})