sukesh
sukesh

Reputation: 2423

How to pass and read multiple params in URL - angularjs

There are 2 views with respective controllers. The links are in View1.Clicking on this link should load View2 and also read the parameters. This is what I have tried but the alert says - undefined. View2 can load with/without params - each case having a different workflow.

View1.html:

<div ng-controller="view1ctrl">
<a href="#/view2/pqid/775/cid/4" >Link1</a>
</div>

app.js:

var app = angular.module('app', ['ngRoute']);
app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when('/view1', {
        templateUrl: 'App/views/view1.html',
        controller: 'view1ctrl'
        })
        .when('/view2', {
            templateUrl: 'App/views/view2.html',
            controller: 'view2ctrl'
        })
        .when('/view2/:pqid/:cid', {
            templateUrl: 'App/views/view2.html',
            controller: 'view2ctrl'
        })            
        .otherwise({
        redirectTo: '/view1'
        });
}]);

view2ctrl.js:

app.controller("view2ctrl", ['$scope','$routeParams',function ($scope, $routeParams) {
    var init = function () {
        alert($routeParams.pqid);
}
init();
}]);

Upvotes: 0

Views: 3156

Answers (1)

tanou
tanou

Reputation: 1093

You are nearly there:

.when('/view2/:pqid/:cid'

maps to a URL in this format :

view2/1234/4567

1234 being the pqid and 4567 the cid.

So your routing, I think is working, just change the link to #/view2/775/4.

Or if you want to keep the same link change your routing to:

#/view2/pqid/:pqid/cid/:cid

Upvotes: 2

Related Questions