2013-10-02 19 views
6

मैं एक सामान्य चर के माध्यम से एक वैश्विक चर का उपयोग करने की कोशिश कर रहा हूं, क्या यह संभव है?कोणीयजेएस: नियंत्रक के बाहर वैश्विक चर का उपयोग कैसे करें?

मैंने रूट रूटस्कोप का उपयोग करके कुछ var सेट किया है और मैं इसे कॉलबैक फ़ंक्शन के माध्यम से एक्सेस करने का प्रयास कर रहा हूं। यह कॉलबैक नियंत्रक से कहा जाता है। मैं उस कॉलबैक में $rootScope पास नहीं करना चाहता हूं।

क्या $rootScope.var तक पहुंचने का कोई तरीका है?

यदि संभव हो तो मैं सेवा का उपयोग करने के लिए खुला हूं।

कृपया सुझाव दें।

धन्यवाद

मैं निम्नलिखित के रूप में rootScope का उपयोग करने की कोशिश कर रहा हूँ:

function fbLandingCtrl($scope, $rootScope) { 
    $rootScope.isFBLoggedin = false; 
    $scope.login = function() { 
     console.log($rootScope.isFBLoggedin); 
     fbHelper.login(getUserInfo); 
     }; 

     function getUserInfo(){ 
      fbHelper.getUserInfo(updateStatus); 
     } 
     function updateStatus(userInfo){ 
      $rootScope.isFBLoggedin = true; 
      console.log($rootScope.isFBLoggedin); 
     } 
    } 

और मेरी सेवा के रूप में है:

myapp.factory('FBService', [ '$rootScope', function ($rootScope) { 
    $rootScope.isFBLoggedin = false; // global variable 
    $rootScope.userName = null; 
    $rootScope.userEmail = null; 

    return { 

     getStatus: function() { 
      return $rootScope.isFBLoggedin; 
     }, 
     setStatus: function(status) { 
      console.log("Status:"+status); 
      return $rootScope.isFBLoggedin = status; 
     } 
     }; 
}]); 

यह updateStatus fn नीचे के रूप में सच isFBLoggedin दिखाया जा रहा है, लेकिन यह है

पर प्रतिबिंबित नहीं कर रहा है मैं {{isFBLoggedin}} प्रिंट कर रहा हूं लेकिन है ts झूठी

अंततः यह काम कर रहा है।

मैंने @ dluz के समाधान का पालन किया।

मैं भी $rootScope.$apply(function() {}}) इस्तेमाल किया विचारों

प्रस्तुत करना

उत्तर

5

कृपया $ rootScope का उपयोग नहीं करते किसी भी समारोह को परिभाषित करने के लिए - यह वास्तव में बुरा व्यवहार है। याद रखें कि $ rootScope सभी के बाद एक वैश्विक चर है। एक पदानुक्रम कोणीय रूप में

<!doctype html> 
<html lang="en" ng-app="myApp"> 
    <head> 
<meta charset="UTF-8"> 
<title>Document</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script> 

    <script> 

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

     myApp.controller('myAppCtrl', ['$scope', 'myService', function ($scope, myService) { 

     console.log(myService.getData()); 

}]) 

     myApp.factory('myService', [ '$rootScope', function ($rootScope) { 

     return { 

     getData: function() { 
      return $rootScope; 
     } 
     }; 
     }]) 


    </script> 

    </head> 
    <body ng-controller="myAppCtrl"> 

    </body> 
    </html> 

$rootScope exists, but it can be used for evil

कार्यक्षेत्र, prototypically पेड़ के शीर्ष पर एक रूट दायरे से इनहेरिट:

आप इस तरह सेवा के माध्यम से $ rootScope मिल सकती है। आम तौर पर इसे अनदेखा किया जा सकता है, क्योंकि अधिकांश विचारों में नियंत्रक होता है, और इसलिए स्वयं का एक दायरा होता है।

कभी-कभी ऐसे डेटा होते हैं जिन्हें आप पूरे ऐप में वैश्विक बनाना चाहते हैं। इनके लिए, आप $ rootScope इंजेक्ट कर सकते हैं और किसी भी अन्य दायरे की तरह मान सेट कर सकते हैं। चूंकि स्कोप रूट स्कोप से प्राप्त होते हैं, इसलिए ये मान आपके स्थानीय $ स्कोप पर मूल्यों की तरह एनजी-शो जैसे निर्देशों से जुड़े अभिव्यक्तियों के लिए उपलब्ध होंगे।

बेशक, वैश्विक स्थिति बेकार है और आपको $ rootScope का उपयोग कम से कम करना चाहिए, जैसे आप (उम्मीद है) किसी भी भाषा में वैश्विक चर के साथ उपयोग करेंगे। विशेष रूप से, कोड, केवल डेटा के लिए इसका उपयोग न करें। यदि आप $ रूटस्कोप पर फ़ंक्शन डालने का लुत्फ उठाते हैं, तो इसे हमेशा ऐसी सेवा में रखना बेहतर होता है जिसे इंजेक्शन किया जा सकता है जहां इसकी आवश्यकता होती है, और अधिक आसानी से परीक्षण किया जाता है।

इसके विपरीत, ऐसी सेवा न बनाएं जिसका जीवन में एकमात्र उद्देश्य डेटा की बिट्स को स्टोर और वापस करना है।

UPDATED उत्तर

A_J, मुझे यकीन है कि अपने आवेदन के परिदृश्य है क्या नहीं कर रहा हूँ। आपको बेहतर जवाब देने के लिए मुझे और कोड देखने की आवश्यकता होगी, लेकिन कृपया नीचे दिए गए कोड को देखें। हो सकता है कि यह आपको कुछ विचार दे सके कि के अंदर $rootScope तक पहुंचने के लिए आप अपना कोड कैसे डिज़ाइन कर सकते हैं।

बटन "मुझे लॉग इन करें" बटन दबाएं और अपने कंसोल पर एक नज़र डालें। यहाँ उदाहरण के कार्य (http://jsbin.com/olOyaHa/1/)

<!doctype html> 
<html lang="en" ng-app="myApp"> 
    <head> 
<meta charset="UTF-8"> 
<title>Document</title> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script> 

<script> 

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

    myApp.controller('fbLandingCtrl', ['$scope', '$rootScope', 'loginService', function ($scope, $rootScope, loginService) { 

    $rootScope.isFBLoggedin = false; 

    $scope.login = function() { 
     console.log('Current login status', $rootScope.isFBLoggedin); 

     console.log(loginService.getUserInfo()); 

     loginService.login(loginService.getUserInfo()); 

     loginService.updateStatus(); 
     }; 


    }]); 


    myApp.factory('loginService', [ '$rootScope', function ($rootScope) { 

    return { 

     login: function() { 
      console.log('now I am logged in!'); 
      return $rootScope.isFBLoggedin = true; 
     }, 

     getUserInfo: function() { 
      return { 
       username: 'xmen', 
       role: 'admin', 
       logged: 'false' 
      }; 
     }, 

     updateStatus: function(userInfo){ 
      $rootScope.isFBLoggedin = true; 
      console.log('Current login status', $rootScope.isFBLoggedin); 
     } 
     }; 
    }]) 


    </script> 

</head> 
<body ng-controller="fbLandingCtrl"> 
    <button ng-click="login()">Log Me In</button> 
</body> 
</html> 
+0

बिल्कुल संपादित किया है, लेकिन क्या मैं सामान्य सेवा से सीधे उस सेवा तक पहुंच सकता हूं? –

+1

आपका "सामान्य कार्य" कहां परिभाषित किया गया है?! यह या तो 'निर्देश' या 'नियंत्रक' के अंदर होगा, है ना?! तो जवाब हां है, आपको बस उस सेवा को अपने निर्देश या नियंत्रक की निर्भरता के रूप में जोड़ने की आवश्यकता है। यदि आपका सामान्य कार्य कहीं और परिभाषित किया गया है, तो यह कोड डिज़ाइन समस्या है और आपको अपने तर्क की समीक्षा करने की आवश्यकता होगी। –

+0

आपका क्या मतलब है "सामान्य कार्य"? किसी भी कोणीय गुंजाइश के बाहर एक समारोह? लगता है जैसे आपके पास कोड डिज़ाइन समस्या है ... – Scalpweb

2

आप अपने नियंत्रक के अंदर $ rootScope.var उपयोग कर सकते हैं अगर आप एक नियंत्रक संदर्भ के रूप में $ rootScope कहा:

function MyCtrl($scope, $rootScope, $routeParams /*, ... */) 
{ 
    /* Controller code and callback code here */ 
} 

यह अपने कॉलबैक के रूप में लंबे समय के रूप में काम करेंगे आपके नियंत्रक के अंदर परिभाषित किया गया है।

संपादित करें: हमारी चर्चा के बाद, इस प्रकार अपनी rootScope अंदर एक समारोह को परिभाषित करने के लिए है:

yourApp.run($rootScope/*, ResourceProvider ... */) { 
    $rootScope.yourFunction= function() { 
     /* The code of you functions */ 
    } 
} 
+0

धन्यवाद लेकिन मैं उस एक कॉलबैक फ़ंक्शन में वर, कि नियंत्रक –

+0

के बाहर क्यों आप एक नियंत्रक के अंदर इस कॉलबैक को परिभाषित नहीं कर सकते हैं की जरूरत है? – Scalpweb

+0

क्योंकि यह एक उपयोगिता समारोह है, कुछ अन्य कार्यों द्वारा भी –

संबंधित मुद्दे