How to pass data from one html page to another using ui.router in angularjs

Question

I retrieve data from back-end and show it in a html page using a controller. When user click a certain link, the other page load according to the link id(here promo page). I want to pass the menu_id to the loading page. I use ngRoute. Below is the html code which I tried,

<li class="table-view-cell" ng-repeat="menu in menuList">
    <a class="navigate-right btn-lg" href="#{{menu.link}}/{{menu_id}}">
          <span class="{{menu.icon}}"></span>
                    {{menu.menuName}}
    </a>
</li>

Below is the routing,

mobileApp.config(function($routeProvider) {
$routeProvider
 .when('/promo/menu._id', {
            templateUrl: 'tpl/promo.html',
            controller: 'promoController',
            activePage: 'promo'
        })

Below is the controller for the promo page which I need to retrieve the menu_id,

$http.get(SERVER_URL + '/api/templates/getCategories?appId='+$rootScope.appId+'&mainId='+$routeParams.id)
        .success(function(data) {
            $scope.requestCategory = data[0];
        }).error(function(err) {
            alert('warning', "Unable to get templates", err.message);
        });

Refer Following Links: stackoverflow.com/questions/24575491/… stackoverflow.com/questions/22408790/… — Malaiyandi Murugan
– Malaiyandi Murugan, Commented Feb 26, 2016 at 4:45
I use ngRoute, I tried those before asking this question. They are not the solution for my problem. — shamila
– shamila, Commented Feb 26, 2016 at 4:51

Aman Gupta · Accepted Answer · 2016-02-26 04:51:10Z

1

mainModule.config([function($routeProvider) {
    $routeProvider.when('/promo/:menu._Id', {
        templateUrl : 'tpl/promo.html',
        controller : 'promoController',
        activePage: 'promo' 
    }); 
}

You can define your routing like above, notice the colon before menu._Id. In your controller, you can access menu._Id using $routeParams service as follows:

$routeParams.menu._Id

Thats's it.

answered Feb 26, 2016 at 4:51

Aman Gupta

531 silver badge8 bronze badges

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

1 Comment

shamila Over a year ago

Same results as before. It is not passing the menu._id

shamila · Accepted Answer · 2016-02-26 05:55:20Z

0

It started to work when I changed the routing as below,

 .when('/promo/:id', {
            templateUrl: 'tpl/promo.html',
            controller: 'promoController',
            activePage: 'promo'
        })

answered Feb 26, 2016 at 5:55

shamila

1,3207 gold badges21 silver badges46 bronze badges

Comments

Aman Gupta · Accepted Answer · 2016-02-27 02:58:31Z

0

In that case you would have to do following in your controller:

$routeParams.id

answered Feb 27, 2016 at 2:58

Aman Gupta

531 silver badge8 bronze badges

Collectives™ on Stack Overflow

How to pass data from one html page to another using ui.router in angularjs

3 Answers 3

1 Comment

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Linked

Related