2016-05-27 5 views
0

私は次のファクトリを持っています。コントローラの関数からsetterを呼び出すと、名前が設定されますが、コントローラからgettersを呼び出すとnullが返されます。なぜ変数の値が表示されないのですか? Getterは角度ファクトリメソッドでヌルを返します

+0

私達にあなたのコントローラのコードを表示します。 Pls – WorkWe

+1

この場合の 'ServiceFactory'は' myFactory'に置き換えてください。 –

+0

はい.its myFactory – Smitha

答えて

0

(function() { 
 
    'use strict'; 
 

 
    angular 
 
     .module('myapp') 
 
     .factory('myFactory', ServiceFactory); 
 

 
    myFactory.$inject = ['$http', '$rootScope']; 
 
    var config = { 
 
     // TO DO : check if anything required 
 
    }; 
 
\t 
 
\t 
 

 
    /* @ngInject */ 
 
    function myFactory($http, $rootScope) { 
 
\t 
 
\t var userName = null; 
 
\t var userId = null; 
 
\t var pwd = null; 
 
\t 
 
\t var service = { 
 
      
 
      getUserName: getUserName, 
 
      setUserName: setUserName, 
 
\t \t \t getPwd:getPwd, 
 
      setPwd:setPwd, 
 
      
 
     }; 
 
\t \t function getUserName() { 
 
      console.log("user name.getUserName." + userName); 
 
      return userName; 
 
     } 
 

 
     function setUserName(userName) { 
 
      console.log("user name.." + userName); 
 
      userName = userName; 
 
     } 
 

 
     
 
     function getPwd() { 
 
      console.log("user getPwd.." + pwd); 
 
      return pwd; 
 
     } 
 

 
     function setPwd(pwd) { 
 
      console.log("user setPwd.." + pwd); 
 
      pwd = pwd; 
 
     } 
 
\t \t 
 
\t \t return service; 
 
\t } 
 
})();

は、基本的には、JavaScriptのレキシカルスコープを理解する必要があります。 javascriptのレキシカルスコープを実行します。そして整流されたコードは以下の通りです。

<html ng-app="myapp"> 
<head> 
    <title>Fixed :Getters return null in Angular Factory methods</title> 
</head> 
<body class="debug" ng-controller="mainCtrl"> 
    {{name}} 
    <script src="angular.min.js"></script> 
    <script> 
     (function() { 
      'use strict'; 

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

      app.factory('myFactory', myFactory); 

      myFactory.$inject = ['$http', '$rootScope']; 
      var config = { 
       // TO DO : check if anything required 
      }; 


      /* @ngInject */ 
      function myFactory($http, $rootScope) { 

       var userName = null; //global 
       var userId = null; //global 
       var pwd = null;  //global 

       var service = { 
        getUserName: getUserName, 
        setUserName: setUserName, 
        getPwd:getPwd, 
        setPwd:setPwd, 
       }; 
       function getUserName() { 
        console.log("user name.getUserName." + userName); 
        return userName; 
       } 

       function setUserName(name) { //userName -> local variable 
        console.log("user name.." + name); 
        // userName = userName; //You thing the leftside "userName" is global but its referencing to localvariable. So give it a differnt name. Cheking variable scope in javascript. 
        userName = name; 
       } 


       function getPwd() { 
        console.log("user getPwd.." + pwd); 
        return pwd; 
       } 

       function setPwd(password) { //pwd -> local variable 
        console.log("user setPwd.." + password); 
        //pwd = pwd; //You thing the leftside "pwd" is global but its referencing to local variable. So give a differnt name. Cheking variable scope in javascript. 
        pwd = password; 
       } 

       return service; 
      } 

      app.controller('mainCtrl',mainCtrlFn); 

      mainCtrlFn.$inject = ['$scope','myFactory']; 

      function mainCtrlFn($scope,myFactory) { 
       myFactory.setUserName("Sai Ram"); 
       $scope.name = myFactory.getUserName(); 
      } 
     })(); 
    </script> 
</body> 

+0

恐ろしく、ありがとう! – Smitha

関連する問題