Lester
Lester

Reputation: 83

Parameter passing in angular ui-router

I have a button that loads the a view using ui router

<button ui-sref="manageactivity.update" >Edit Event</button>

and I would like to pass a {{activity.id}} into the template

app.config(function ($stateProvider, $urlRouterProvider) {

$stateProvider          
    .state('manageactivity.update', {
        url: '/update/:id',
        templateUrl: "update.html",
        controller: 'eventMgmtCtrl'     
    }); 
});

app.controller("eventMgmtCtrl", function ($scope,$stateParams) {
    $scope.testID = $stateParams.id;    
});

I do know how to do it in normal angular routing, by passing it through the url as such, but it does not work for ui router because ui-router uses the name of the state instead of the url?

<button data-ng-href="#Update/{{activity.id}}" >Edit Event</button>

What changes do I need ?

Upvotes: 0

Views: 83

Answers (2)

BHUVNESH KUMAR
BHUVNESH KUMAR

Reputation: 401

You can pass data in "ui-sref" as following way:

HTML:-

<button ui-sref="manageactivity.update({'id':'activity.id'})" >Edit Event</button>

Than you can receive data in controller as following way:-

Controller:-

 $scope.id = $stateParams.id;

Upvotes: 3

pritesh
pritesh

Reputation: 2192

You can pass data in ui-sref as

<button ui-sref="manageactivity.update({id: activity.id})" >Edit Event</button>

And you can access it in the page using the $stateParams as you defined in the question...Good Luck

Upvotes: 4

Related Questions