How in Angularjs, passing scope between routes ?

How in Angularjs, passing scope between routes ?

Asked on October 23, 2018 in AngularJs.
Add Comment


  • 6 Answer(s)

    in every-pseudo-code:

    Set

    
    $scope.val = <Some dynamic data>
    
    

    Click a link and be routed to a new template (probably with the same controller).

    
    $scope.val
    
    

    should still be the same value as it was on the last page.

    Answered on October 23, 2018.
    Add Comment

      This is we define the service :

    app.factory("user",function()
    {
      return {};
    });
    

    In your first controller:

    app.controller( "RegistrationPage1Controller",function($scope,user)
    {
      $scope.user = user;
      // and then set values on the object
      $scope.user.firstname = "John";
      $scope.user.secondname = "Smith";
    });
    app.controller( "RegistrationSecondPageController",function($scope,user)
    {
        $scope.user = user;
        // and then set values on the object
        $scope.user.address = "1, Mars";
    });
    

     

    Answered on October 23, 2018.
    Add Comment

       ui-router therefore you’ll have nested named views. Then in pseudo-code:

        Then WizardController defines the scope variables that you simply need to preserve across the steps of the multi-page kind (which i am bearing on as a “wizard”). Then your routes can update stepView solely. every step will have its own templates, controllers and scopes, however their scopes square measure lost from page to page. however the scopes in WizardController square measure preserved across all pages.

        To update the WizardController scopes from the kid controllers, you’ll have to use syntax like $scope.$parent.myProp = ‘value’ or outline a operate setMyProp on WizardController for every scope variable. Otherwise, if you are attempting to line the parent scope variables directly from the kid controllers, you may find yourself simply making a replacement scope variable on the kid itself, shadowing the parent variable.

    Answered on October 23, 2018.
    Add Comment

    In this route provider its  define the first and second route and also  pass in our the two components that we will be defining in below code:

    function routeTestProvider($routeProvider){
      $routeProvider
        .when('/route1', {
          template: '<route1></route1>'
        })
        .when('/route2', {
          template: '<route2></route2>'
        });
    }
    routeTestProvider.$inject = ['$routeProvider'];
    angular.module('root')
      .config(routeTestProvider);
    
    Answered on December 14, 2018.
    Add Comment

    A really simple solution is mentioned below  to use children states. $cope variables will be shared and you will be able to share data between this 2 pages.

    .state({
      name: 'global',
      url: '^/',
      templateUrl: './partials/global.html',
      children: [
       {
          name: 'page1',
          url: '/page1',
          templateUrl: './partials/page1.html'
        },
          {
            name: 'page2',
            url: '/page2',
            templateUrl: './partials/page2.html'
          }
        ]
    })
    
    Answered on December 14, 2018.
    Add Comment

    ou need to use a service since a service will persist throughout your app’s life.

    Lets say you want to save data pertaining to a user

    This is how you define the service :

    app.factory("user",function(){
            return {};
    });

    In your first controller:

    app.controller( "RegistrationPage1Controller",function($scope,user){
        $scope.user = user;
        // and then set values on the object
        $scope.user.firstname = "John";
        $scope.user.secondname = "Smith";
    });
    
    app.controller( "RegistrationSecondPageController",function($scope,user){
            $scope.user = user;
            // and then set values on the object
            $scope.user.address = "1, Mars";
    
        });
    Answered on February 22, 2019.
    Add Comment


  • Your Answer

    By posting your answer, you agree to the privacy policy and terms of service.