Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • World
  • Users
  • Groups
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Code Project
  1. Home
  2. Web Development
  3. JavaScript
  4. AngularJS: Why people prefer factory to share data between controllers

AngularJS: Why people prefer factory to share data between controllers

Scheduled Pinned Locked Moved JavaScript
tutorialjavascriptcomquestionannouncement
2 Posts 2 Posters 0 Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M Offline
    M Offline
    Mou_kol
    wrote on last edited by
    #1

    i am new in angular. so trying to know how to share data between two controller and search google. i visited few pages and found most of the time people use factory to share data. i just like to know can't we do it by service instead of factory ? 1st example

    Input is : {{data.firstName}}


    Input should also be here: {{data.firstName}}

    myApp.factory('MyService', function(){
    return {
    data: {
    firstName: '',
    lastName: ''
    },
    update: function(first, last) {
    // Improve this method as needed
    this.data.firstName = first;
    this.data.lastName = last;
    }
    };
    });

    // Your controller can use the service's update method
    myApp.controller('SecondCtrl', function($scope, MyService){
    $scope.data = MyService.data;

    $scope.updateData = function(first, last) {
    MyService.update(first, last);
    }
    });

    2nd example

    var myApp = angular.module('myApp', []);

    myApp.factory('Data', function(){

    var service = {
        FirstName: '',
        setFirstName: function(name) {
            // this is the trick to sync the data
            // so no need for a $watch function
            // call this from anywhere when you need to update FirstName
            angular.copy(name, service.FirstName); 
        }
    };
    return service;
    

    });

    // Step 1 Controller
    myApp.controller('FirstCtrl', function( $scope, Data ){

    });

    // Step 2 Controller
    myApp.controller('SecondCtrl', function( $scope, Data ){
    $scope.FirstName = Data.FirstName;
    });

    examples are taken from this url https://stackoverflow.com/questions/21919962/share-data-between-angularjs-controllers please guide me.

    O 1 Reply Last reply
    0
    • M Mou_kol

      i am new in angular. so trying to know how to share data between two controller and search google. i visited few pages and found most of the time people use factory to share data. i just like to know can't we do it by service instead of factory ? 1st example

      Input is : {{data.firstName}}


      Input should also be here: {{data.firstName}}

      myApp.factory('MyService', function(){
      return {
      data: {
      firstName: '',
      lastName: ''
      },
      update: function(first, last) {
      // Improve this method as needed
      this.data.firstName = first;
      this.data.lastName = last;
      }
      };
      });

      // Your controller can use the service's update method
      myApp.controller('SecondCtrl', function($scope, MyService){
      $scope.data = MyService.data;

      $scope.updateData = function(first, last) {
      MyService.update(first, last);
      }
      });

      2nd example

      var myApp = angular.module('myApp', []);

      myApp.factory('Data', function(){

      var service = {
          FirstName: '',
          setFirstName: function(name) {
              // this is the trick to sync the data
              // so no need for a $watch function
              // call this from anywhere when you need to update FirstName
              angular.copy(name, service.FirstName); 
          }
      };
      return service;
      

      });

      // Step 1 Controller
      myApp.controller('FirstCtrl', function( $scope, Data ){

      });

      // Step 2 Controller
      myApp.controller('SecondCtrl', function( $scope, Data ){
      $scope.FirstName = Data.FirstName;
      });

      examples are taken from this url https://stackoverflow.com/questions/21919962/share-data-between-angularjs-controllers please guide me.

      O Offline
      O Offline
      onelopez
      wrote on last edited by
      #2

      This SO should explain it rather well, https://stackoverflow.com/a/21900284

      1 Reply Last reply
      0
      Reply
      • Reply as topic
      Log in to reply
      • Oldest to Newest
      • Newest to Oldest
      • Most Votes


      • Login

      • Don't have an account? Register

      • Login or register to search.
      • First post
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • World
      • Users
      • Groups