McFiddlyWiddly McFiddlyWiddly - 4 months ago 58
AngularJS Question

How can I pass data between states with angular ui-router?

I originally did not intend on doing the project with ui-router (just got to know about it 2 days ago), so I'm quite new at this.

What I have for this issue is :


  1. Template for list of images, shown using ng-repeat, and getting img-src from a service called in the controller. The service gets the source from a json file.




  2. Template for image editor. The controller for this should get the image source of the image that was clicked in the image list.



How do I pass the image source from one state (the image list) to the another state (the image editor)?

I was using a service to do that when I was assuming that I won't use ui-router and its states. How do I do this with states?

Answer

I think you can pass an image id from state 1 to state 2, and get it in state 2 controller:

$stateProvider
.state('state', {
    url: "/test/:id",
    templateUrl: 'template.html',
    controller: function ($stateParams) {
        console.log($stateParams.id);
    }
})

and the link from the first page ui-sref="state({id:42})"

Comments