AngularJs: pass $ scope variable with service

Question

I have two controllers, and in one of them I declared the variable $ scope, which I would like to see in the second controller.

First controller

app.controller('Ctrl1', function ($scope) {
    $scope.variable1 = "One";
});

Second controller

app.controller('Ctrl2', function ($scope, share) {
   console.log("shared variable " + share.getVariable());
});

I explored the best Angular approach, and I found that this is using the service. So I added a service forCtrl1

Service

.service('share', function ($scope) {
    return {
        getVariable: function () {
            return $scope.variable1;
        }
    };
});

This code returns this error:

Unknown provider: $scopeProvider <- $scope <- share

So my question is: is $ share variable possible between controllers? Not the best Angular solution or am I missing something?

Sorry for my trivial question, but I'm starting Angular.

Thanks in advance

Hi

Answer 1

You cannot add a $scopedependency in a factory service.

- .

.service('share', function () {
    var self = this;
    //private shared variable
    var sharedVariables = { };
    self.getSharedVariables = getSharedVariables;
    self.setVariable = setVariable;

    //function declarations
    function getSharedVariables() {
        return sharedVariables;
    }
    function setVariable() {
        sharedVariables[paramName] = value;
    }
});

app.controller('Ctrl1', function ($scope, share) {
    $scope.variable1 = "One";
    share.setVariable('variable1', $scope.variable1); //setting value in service variable
});

app.controller('Ctrl2', function ($scope, share) {
    console.log("shared variable " + share.getSharedVariables());
});

Answer 2

, factory. $scope . factory, , . factory , index.html

 app.controller('Ctrl1', function ($scope,myService,$state) {
        $scope.variable1 = "One";
        myService.set($scope.variable1);
        $state.go('app.thepagewhereyouwanttoshare');//go to the page where you want to share that variable.
    });

 app.controller('Ctrl2', function ($scope, myService) {
   console.log("shared variable " + myService.get());
});
    .factory('myService', function() {
      function set(data) {
        products = data;
      }
      function get() {
        return products;
      }

      return {
        set: set,
        get: get
      }

    })

Answer 3

: $rootScope .

$rootScope. $scope . :

angular.module('myApp', [])
.run(function($rootScope) {
    $rootScope.test = new Date();
})
.controller('myCtrl', function($scope, $rootScope) {
  $scope.change = function() {
        $scope.test = new Date();
    };

    $scope.getOrig = function() {
        return $rootScope.test;
    };
})
.controller('myCtrl2', function($scope, $rootScope) {
    $scope.change = function() {
        $scope.test = new Date();
    };

    $scope.changeRs = function() {
        $rootScope.test = new Date();
    };

    $scope.getOrig = function() {
        return $rootScope.test;
    };
});

Answer 4

, $scope . , , ,

.service('share', function ($scope) {
    this.variable1 = '';
    return {
        getVariable: function () {
            return this.variable1;
        }
        setVariable(variable)
        {
            this.variable1 = variable;
        }
    };
});

app.controller('Ctrl1', function (share) {
    $scope.variable1 = share.getVariable();
});

: fooobar.com/questions/21168/...

Answer 5

- . $rootScope, $scope.

. .

.service('share', function ($scope) {

    var variable = 42;

    return {
        getVariable: function () {
            return variable;
        }
    };
});

app.controller('Ctrl', function ($scope, share) {
    console.log("shared variable " + share.getVariable());

    // Watch for changes in the service property
    $scope.$watch(function() { return share.getVariable(); }, function(oldValue, newValue) {
        // whatever
    });
});

Answer 6

-, :

app.service('share', function () {
    // this is a private variable
    var variable1;
    return {
        // this function get/sets the value of the private variable variable1
        variable1: function (newValue) {
            if(newValue) variable1 = newValue;
            return variable1;
        }
    };
});

To set the value of a shared variable, pass the value of the function that we created in the service

app.controller('Ctrl1', function ($scope, share) {
    $scope.variable1 = "One";
    // share the value of $scope.variable1
    share.variable1($scope.variable1);
});

To get the value of a shared variable, also use a function in the service without passing a value

app.controller('Ctrl2', function ($scope, share) {
    console.log("shared variable " + share.variable1());
});