चर को संग्रहीत करने के लिए मैं Angular में $ rootScope का उपयोग कैसे करूं?

217

मैं $rootScopeएक नियंत्रक में चर को संग्रहीत करने के लिए कैसे उपयोग कर सकता हूं जिसे मैं बाद में किसी अन्य नियंत्रक में एक्सेस करना चाहता हूं? उदाहरण के लिए:

angular.module('myApp').controller('myCtrl', function($scope) {
  var a = //something in the scope
  //put it in the root scope
});

angular.module('myApp').controller('myCtrl2', function($scope) {
  var b = //get var a from root scope somehow
  //use var b
});

यह मैं कैसे करूंगा?

— trysis
स्रोत

1

आपको नियंत्रक में $ rootScope इंजेक्षन करना चाहिए और इसे सरल जावास्क्रिप्ट के रूप में उपयोग करना चाहिए

— Ajay Beniwal

30

$ rootScope ऐसा करने का सही तरीका नहीं है। कई नियंत्रकों के लिए उपलब्ध चर बनाना बहुत ज्यादा है जो सेवाओं के लिए हैं।

— स्टीव

11

@Steve: एंगुलर के अक्सर पूछे जाने वाले प्रश्न कहते हैं, "ऐसी सेवा न बनाएं जिसका जीवन में एकमात्र उद्देश्य डेटा को स्टोर करना और वापस करना है" यह $ डाइजेस्ट साइकल पर बहुत अधिक भार

— डालेगा

यदि मैं नियंत्रकों को सेवाओं में इंजेक्ट नहीं कर सकता, तो मैं आपकी बताई गई सेवा से अपने अन्य नियंत्रक को एक चर कैसे भेजूं? मुझे यह काम पाने का कोई रास्ता नहीं दिख रहा है ... यहाँ आपकी अंतर्दृष्टि की सराहना करें ..

— उतरा

2

ठीक है, क्योंकि यह इंजेक्शन नहीं है, आपको इसके लिए एक सिरिंज की आवश्यकता होगी ..

— Xsmael

248

रूट-स्कोप पर सेट वेरिएबल्स प्रोटिओपिकल इनहेरिटेंस के माध्यम से कंट्रोलर स्कोप के लिए उपलब्ध हैं।

यहाँ @ नीतीश के डेमो का एक संशोधित संस्करण है जो रिश्ते को थोड़ा स्पष्ट दिखाता है: http://jsfiddle.net/TmPk5/6/

ध्यान दें कि rootScope का वैरिएबल तब सेट होता है जब मॉड्यूल इनिशियलाइज़ हो जाता है, और फिर विरासत में दिए गए स्कोप में से प्रत्येक को अपनी कॉपी मिलती है जिसे स्वतंत्र रूप से ( changeफंक्शन) सेट किया जा सकता है । इसके अलावा, rootScope का मान भी अपडेट किया जा सकता है ( changeRsफ़ंक्शन में myCtrl2)

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;
    };
});

— जेसन
स्रोत

7

प्लस 1 के लिए ... उह ... वास्तव में ओपी के सवाल का जवाब दे रहा है। (हालांकि @MBielski और अन्य सही हैं)।

— रैप

यदि मैं करूँ $scope.test = 'Some value', तो क्या $rootScope.testपरिवर्तन भी होगा?

— एलन लिनाटोक

@AllenLinatoc नहीं, यह अभिप्रेत है कि वे दो अलग-अलग वस्तुएं हैं, हालांकि $rootScope वैश्विक (सभी नियंत्रकों पर) का दायरा है , लेकिन $scopeनियंत्रक के लिए स्थानीय रहता है। यदि आप $scope.testदो अलग-अलग नियंत्रकों में उपयोग करते हैं, तो जानें कि वे दो अलग-अलग $rootScope.test चर हैं जो सभी नियंत्रकों में समान चर होंगे

— Xsmael

मैं मान रहा हूं कि आप $ rootScope का उपयोग अक्सर नहीं करना चाहेंगे, इसी कारण से आप अन्य भाषाओं में वैश्विक चर का उपयोग नहीं करेंगे?

— Zypps987

हम एक ऐप में कितनी संख्या में rootcope वैरिएबल बना सकते हैं?

— Jay

161

नियंत्रकों के बीच डेटा साझा करना फैक्टरियों / सेवाओं के लिए बहुत अच्छा है। संक्षेप में, यह कुछ इस तरह से काम करता है।

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

app.factory('items', function() {
    var items = [];
    var itemsService = {};

    itemsService.add = function(item) {
        items.push(item);
    };
    itemsService.list = function() {
        return items;
    };

    return itemsService;
});

function Ctrl1($scope,items) {
    $scope.list = items.list; 
}

function Ctrl2($scope, items) {
    $scope.add = items.add;
}

आप इस पहेली में एक कार्यशील उदाहरण देख सकते हैं: http://jsfiddle.net/mbielski/m8saa/

— MBielski
स्रोत

49

+1 का $rootScopeउपयोग तब नहीं किया जाना चाहिए जब हमारे पास सेवाओं और कारखानों जैसी चीजें हों।

— jjperezaguinaga

74

खैर, कोणीय अकसर पूछे जाने वाले प्रश्न पृष्ठ के नीचे यह कहते हैं: "इसके विपरीत, ऐसी सेवा न बनाएं जिसका जीवन में एकमात्र उद्देश्य बिट्स को संग्रहीत करना और वापस करना है।" देखें: docs.angularjs.org/misc/faq

— Oytun

11

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

— MBelski

1

लेकिन अगर आपको दो अलग-अलग दृश्य / नियंत्रक में अपने आइटम को लूप करने की आवश्यकता है, तो आपको इसे देखने के लिए नियंत्रक में पहले डेटा को कॉपी करने की आवश्यकता है? (मेरा मानना है कि यह $ रूटस्कॉप हल है)

— थॉमस

1

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

— उतरा

21

angular.module('myApp').controller('myCtrl', function($scope, $rootScope) {
   var a = //something in the scope
   //put it in the root scope
    $rootScope.test = "TEST";
 });

angular.module('myApp').controller('myCtrl2', function($scope, $rootScope) {
   var b = //get var a from root scope somehow
   //use var b

   $scope.value = $rootScope.test;
   alert($scope.value);

 //    var b = $rootScope.test;
 //  alert(b);
 });

डेमो

— नीतीश कुमार
स्रोत

तो कोणीय में आप आमतौर पर var का उपयोग नहीं करते हैं?

— कोशिश

1

इसकी स्थिति पर निर्भर करता है। यदि आप html में दिखाना चाहते हैं तो u का उपयोग करने की आवश्यकता है अन्यथा u var का उपयोग कर सकते हैं

— Nitish Kumar

DOM सामान के लिए ओह स्कोप है?

— कोशिश

1

यह देर हो सकती है लेकिन किसी भी देर से आने वाले के लिए, स्कोप प्रति एजेएस दस्तावेज के दृश्य और नियंत्रक के बीच एक गोंद है। गुंजाइश सीधे डोम का संदर्भ नहीं देती है। फिर यह क्या करता है? यहाँ अधिक पूरी तरह से डॉक्स dang.angularjs.org/guide/scope

— yantaq

9

मुझे इस $ गुंजाइश को करने का कोई कारण नहीं मिलता है। मूल्य = $ rootScope.test;

$ गुंजाइश पहले से ही $ rootScope से प्रोटोटाइप वंशानुक्रम है।

कृपया इस उदाहरण को देखें

var app = angular.module('app',[]).run(function($rootScope){
$rootScope.userName = "Rezaul Hasan";
});

अब आप इस स्कोप वैरिएबल को ऐप टैग में कहीं भी बांध सकते हैं।

— roconmachine
स्रोत

6

पहले $ rootScope में मानों को संग्रहीत करें

.run(function($rootScope){
$rootScope.myData = {name : "nikhil"}
})

.controller('myCtrl', function($scope) {
var a ="Nikhilesh";
$scope.myData.name = a;
});

.controller('myCtrl2', function($scope) {
var b = $scope.myData.name;
)}

$ rootScope सभी $ स्कोप का जनक है, प्रत्येक $ स्कोप को $ rootScope डेटा की एक प्रति प्राप्त होती है जिसे आप $ स्कोप का उपयोग करके एक्सेस कर सकते हैं।

— निखिलेश यादव
स्रोत

3

यदि यह सिर्फ "अन्य नियंत्रक में पहुंच" है, तो आप इसके लिए कोणीय स्थिरांक का उपयोग कर सकते हैं, लाभ है; आप कुछ वैश्विक सेटिंग्स या अन्य चीजें जोड़ सकते हैं जिन्हें आप पूरे एप्लिकेशन तक पहुंचना चाहते हैं

app.constant(‘appGlobals’, {
    defaultTemplatePath: '/assets/html/template/',
    appName: 'My Awesome App'
});

और फिर इसे इस तरह एक्सेस करें:

app.controller(‘SomeController’, [‘appGlobals’, function SomeController(config) {
    console.log(appGlobals);
    console.log(‘default path’, appGlobals.defaultTemplatePath);
}]);

(परीक्षण नहीं किया)

अधिक जानकारी: http://ilikekillnerds.com/2014/11/constants-values-global-variables-in-angularjs-the-right-way/

— रज़ा अहमद
स्रोत

2

http://astutejs.blogspot.in/2015/07/angularjs-what-is-rootscope.html

 app.controller('AppCtrl2', function ($scope, $rootScope) {
     $scope.msg = 'SCOPE';
     $rootScope.name = 'ROOT SCOPE';
 });

— सतीश
स्रोत

1

इसे प्राप्त करने के कई तरीके हैं: -

1. विधि $rootScopeमें जोड़ें.run

.run(function ($rootScope) {
    $rootScope.name = "Peter";
});

// Controller
.controller('myController', function ($scope,$rootScope) {
    console.log("Name in rootscope ",$rootScope.name);
    OR
    console.log("Name in scope ",$scope.name);
});

2. एक सेवा बनाएं और इसे दोनों नियंत्रकों में एक्सेस करें।

.factory('myFactory', function () {
     var object = {};

     object.users = ['John', 'James', 'Jake']; 

     return object;
})
// Controller A

.controller('ControllerA', function (myFactory) {
    console.log("In controller A ", myFactory);
})

// Controller B

.controller('ControllerB', function (myFactory) {
    console.log("In controller B ", myFactory);
})

— ओजस कुलकर्णी
स्रोत