javascript - Need to pass $scope with variables to another page in angular? -

i have routes:

$routeprovider             .when('/', {                 templateurl: 'views/main.html',                 controller: 'mainctrl',                 controlleras: 'main'             })             .when('/next', {               templateurl: 'views/next.html',               controller: 'mainctrl',               controlleras: 'main'             })             .otherwise({                 redirectto: '/'             }); 

when i'm in main page. clicking next button , see 'views/next.html'. i'm not have $scope. how can scope?

new route renders new template , bind new scope template. can't use same scope both routes. however, there @ least 2 workarounds.

1). $rootscope. $rootscope available in views can store data in , able access in template.

2). service. use shared service in both controllers. optimal solution cases.