简体   繁体   中英

How do I pass values from one route to another in angular?

I am using angular router, and I have a route similar to the one below

angular.module("manageAbcApp", ["myApp", "ngRoute"])
        .config(['$routeProvider', function($routeProvider) {
            $routeProvider
                .when('/list', {
                    templateUrl: '/Scripts/app/views/abc/AbcList.htm',
                    controller: 'ListAbcController'
                })
                .when('/view/:id', {
                    templateUrl: '/Scripts/app/views/abc/AbcDashboard.htm',
                    controller: 'DashboardAbcController'
                })
                // more...
                .otherwise({
                        redirectTo: '/list'
                    });
        }]);

So as you can see there are 2 routes one for listing and other for dashboard of the item selected for the listing.

In the listing route a list view is selected and shown where I show a grid with some data, one of the column in this grid is the name column which is clickable and on click of it i change the route to href="#/view/{row.Id}" .

This works fine.

But, How do I also pass some additional paramters to the DashboardAbcController like the name or any other details ?

Edit: I figured out I could use a service common to both these controller and on ng-click update some model in the service. But I do not want to use ng-click coz if I do then I ll lose the option to allow user to open my link in new tab, copy paste, share etc...

either use $rootscope to assign values ex. $rootscope.name = 'name' or use get parameter

.when('/view/:id?name=&id=', {
     templateUrl: '/Scripts/app/views/abc/AbcDashboard.htm',
     controller: 'DashboardAbcController'
  })

What about something like: Demo

.when('/list', {
    templateUrl: '/Scripts/app/views/abc/AbcList.htm',
    controller: 'ListAbcController'
})
.when('/view/:id/:name/:other/:details', {
    templateUrl: '/Scripts/app/views/abc/AbcDashboard.htm',
    controller: 'DashboardAbcController'
})

And, you could create a link like:

<a href="#/home/1/some_name/other/details?random=random">Home</a>

Note: That you can pass other data as route params that you don't want to fix into the routes.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM