AngularJS: मैं नियंत्रकों के बीच चर कैसे पार कर सकता हूं?

Question

मेरे पास दो कोणीय नियंत्रक हैं:

function Ctrl1($scope) {
    $scope.prop1 = "First";
}

function Ctrl2($scope) {
    $scope.prop2 = "Second";
    $scope.both = Ctrl1.prop1 + $scope.prop2; //This is what I would like to do ideally
}

मैं Ctrl1अंदर उपयोग नहीं कर सकता Ctrl2क्योंकि यह अपरिभाषित है। लेकिन अगर मैं इसे ऐसे ही…

function Ctrl2($scope, Ctrl1) {
    $scope.prop2 = "Second";
    $scope.both = Ctrl1.prop1 + $scope.prop2; //This is what I would like to do ideally
}

मुझे एक त्रुटि मिलती है। क्या किसी को भी यह करना आता है?

करते हुए

Ctrl2.prototype = new Ctrl1();

भी विफल हो जाता है।

नोट: इन नियंत्रकों को एक दूसरे के अंदर नेस्टेड नहीं किया गया है।

Comments

कई तरीके हैं लेकिन सबसे अच्छा तरीका कोणीय घड़ी है। हमेशा जब हम एक फ्रेमवर्क का उपयोग करते हैं, तो काम करने के लिए अपने स्वयं के तरीकों का उपयोग करने का सबसे अच्छा तरीका यह मत भूलो

— pejman

मुझे यह ब्लॉग बहुत उपयोगी ब्लॉग लगा

— ब्लैक माम्बा

Answer 1

एकाधिक नियंत्रकों में चर साझा करने का एक तरीका यह है कि आप एक सेवा बनाएँ और इसे किसी भी नियंत्रक में इंजेक्ट करें जहाँ आप इसका उपयोग करना चाहते हैं।

सरल सेवा उदाहरण:

angular.module('myApp', [])
    .service('sharedProperties', function () {
        var property = 'First';

        return {
            getProperty: function () {
                return property;
            },
            setProperty: function(value) {
                property = value;
            }
        };
    });

नियंत्रक में सेवा का उपयोग करना:

function Ctrl2($scope, sharedProperties) {
    $scope.prop2 = "Second";
    $scope.both = sharedProperties.getProperty() + $scope.prop2;
}

यह इस ब्लॉग में बहुत अच्छी तरह से वर्णित है (पाठ 2 और विशेष रूप से)।

मैंने पाया है कि यदि आप इन गुणों को कई नियंत्रकों के साथ बाँधना चाहते हैं तो यह बेहतर है अगर आप किसी वस्तु के गुण को एक आदिम प्रकार (बूलियन, स्ट्रिंग, संख्या) के बजाय बांधते हैं, तो यह बाध्य संदर्भ को बनाए रखेगा।

उदाहरण: के var property = { Property1: 'First' };बजाय var property = 'First';।

---

अद्यतन करें: (उम्मीद है) चीजों को और अधिक स्पष्ट करें यहां एक ऐसी पहेली है जो इसका उदाहरण दिखाती है:

• साझा मूल्य की स्थिर प्रतियों को बांधना (myController1 में)
  • एक आदिम (स्ट्रिंग) को बांधना
  • किसी ऑब्जेक्ट की संपत्ति से बाइंड करना (स्कोप वैरिएबल पर सहेजा गया)
• यूआई को अपडेट करने वाले साझा मूल्यों को बांधते हुए मानों को अपडेट किया जाता है (myController2 में)
  • एक समारोह में बांधना जो एक आदिम (स्ट्रिंग) लौटाता है
  • वस्तु की संपत्ति से बाँधना
  • किसी वस्तु की संपत्ति से दो तरह से बंधन

Comments

इस स्थिति में - जब CtrlProperties.getProperty () मान बदलता है तो Ctrl 2 का स्कोप "पता" कैसे होगा?

— ओर्फव्यू

यदि आप चाहते हैं कि आपका UI हर बार संपत्ति में बदलाव करे तो आप bothएक फ़ंक्शन में बदल सकते हैं और इसे कोणीय डाइजेस्ट प्रक्रिया के दौरान पुन: मूल्यांकन किया जाएगा। एक उदाहरण के लिए इस फिडेल को देखें । इसके अलावा अगर आप किसी वस्तु की संपत्ति से जुड़ते हैं, तो आप इसे सीधे अपने दृश्य में उपयोग कर सकते हैं और यह अपडेट होगा क्योंकि डेटा इस उदाहरण के समान बदल गया है ।

— ग्लॉपी

आप पता लगाने के लिए चाहते हैं और अपने नियंत्रक में परिवर्तन के लिए प्रतिक्रिया तो एक विकल्प जोड़ने के लिए है getProperty()गुंजाइश के लिए समारोह और प्रयोग $ गुंजाइश। $ घड़ी में की तरह इस उदाहरण । आशा है कि ये उदाहरण मदद करेंगे!

— ग्लॉपी

यहां एक समस्या है क्योंकि सेवाएं स्टेटलेस होनी चाहिए। किसी सेवा के अंदर एक संपत्ति को संग्रहीत करना गलत (लेकिन सुविधाजनक) है। मैंने डेटा पढ़ने और लिखने के लिए $ cacheFactory का उपयोग करना शुरू किया। मैं ग्लॉपी के रूप में लगभग एक समान सेवा का उपयोग करता हूं, लेकिन सेवा में राज्य को संग्रहीत करने के बजाय यह अब कैश में है। सबसे पहले एक कैश सेवा बनाएं: angular.module ('CacheService', ['ng']) .factory ('CacheService', function ($ cacheFactory) {$ $ cacheFactory ('CacheService';}) वापस करें); अपने app.js में शामिल करें, इसे सेवा में इंजेक्ट करें, इसे इस तरह उपयोग करें: CacheService.get (key) लौटाएं; या CacheService.put (कुंजी, मूल्य);

— जॉर्डन पापालेओ

इस उत्तर का उपयोग कैसे और क्यों करने की कोशिश कर रहा है .serviceइसके बजाय .factoryकोणीय डॉक्स में वर्णित किया गया है। जब दस्तावेज़ किसी भिन्न विधि का उपयोग करता है तो यह उत्तर इतना अधिक क्यों होता है?

— pspahn

Answer 2

मुझे सरल उदाहरणों द्वारा सरल चीजों को चित्रित करना पसंद है :)

यहाँ एक बहुत ही सरल Serviceउदाहरण दिया गया है:

angular.module('toDo',[])

.service('dataService', function() {

  // private variable
  var _dataObj = {};

  // public API
  this.dataObj = _dataObj;
})

.controller('One', function($scope, dataService) {
  $scope.data = dataService.dataObj;
})

.controller('Two', function($scope, dataService) {
  $scope.data = dataService.dataObj;
});

और यहाँ jsbin

और यहाँ एक बहुत ही सरल Factoryउदाहरण है:

angular.module('toDo',[])

.factory('dataService', function() {

  // private variable
  var _dataObj = {};

  // public API
  return {
    dataObj: _dataObj
  };
})

.controller('One', function($scope, dataService) {
  $scope.data = dataService.dataObj;
})

.controller('Two', function($scope, dataService) {
  $scope.data = dataService.dataObj;
});

और यहाँ jsbin

---

यदि यह बहुत सरल है, तो यहां एक अधिक परिष्कृत उदाहरण है

संबंधित सर्वोत्तम अभ्यास टिप्पणियों के लिए यहां भी उत्तर देखें

Comments

हाँ, मैं आपसे सहमत हूँ। हमेशा चीजों को सरल बनाने की कोशिश करें।

— इवान हू

var _dataObj = {};जब आप इसका सीधा संदर्भ देते हैं तो घोषित करने में क्या बात है ..? वह निजी नहीं है । पहले उदाहरण में आप कर सकते हैं this.dataObj = {};और दूसरे में return { dataObj: {} };यह एक बेकार चर घोषणा IMHO है।

— TJ

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

— दिमित्री जैतसेव

@DmitriZaitsev आप "सरल उदाहरण" कहते हैं, लेकिन जब तक आप ठीक से नहीं दिखाते कि निजी राज्य का उपयोग कैसे किया जाए, आप लोगों को भ्रमित कर रहे हैं। जब तक आप सीधा संदर्भ लौटाते हैं, आपके उदाहरण में कोई निजी स्थिति नहीं है।

— TJ

@ टीजे मुझे कुछ भी भ्रमित नहीं दिखता है। एक निजी चर एक मॉड्यूल द्वारा उजागर किया जा सकता है। बेहतर उत्तर देने के लिए स्वतंत्र महसूस करें।

— दिमित्री जैतसेव

Answer 3

--- मुझे पता है कि यह उत्तर इस प्रश्न के लिए नहीं है, लेकिन मैं ऐसे लोगों को चाहता हूं जो इस प्रश्न को पढ़ते हैं और ऐसा करने में परेशानी से बचने के लिए फैक्ट्रियों जैसी सेवाओं को संभालना चाहते हैं ----

इसके लिए आपको एक सेवा या एक कारखाने का उपयोग करने की आवश्यकता होगी।

सेवाओं नेस्टेड नियंत्रकों के बीच डेटा साझा करने के लिए सबसे अच्छा तरीका है।

डेटा साझा करने के बारे में इस विषय पर एक बहुत अच्छी टिप्पणी है कि वस्तुओं को कैसे घोषित किया जाए। इससे पहले कि मैं इसके बारे में पढ़ूँ, मैं अशुभ था क्योंकि मैं एक AngularJS जाल में गिर गया था, और मैं बहुत निराश था। तो मुझे इस मुसीबत से बचने में आपकी मदद करने दीजिए।

मैंने "एनजी-बुक: एंगुलरजेएस पर पूरी किताब" से पढ़ा है कि एंगुलरजेएस एनजी-मॉडल जो नंगे-डेटा के रूप में नियंत्रकों में बनाए जाते हैं, गलत हैं!

एक $ गुंजाइश तत्व इस तरह बनाया जाना चाहिए:

angular.module('myApp', [])
.controller('SomeCtrl', function($scope) {
  // best practice, always use a model
  $scope.someModel = {
    someValue: 'hello computer'
  });

और इस तरह नहीं:

angular.module('myApp', [])
.controller('SomeCtrl', function($scope) {
  // anti-pattern, bare value
  $scope.someBareValue = 'hello computer';
  };
});

इसका कारण यह है कि DOM (html डॉक्यूमेंट) के लिए कॉल को शामिल करने के लिए इसे (BEST PRACTICE) पुनः शामिल किया गया है

<div ng-model="someModel.someValue"></div>  //NOTICE THE DOT.

नेस्टेड कंट्रोलर्स के लिए यह बहुत मददगार है अगर आप चाहते हैं कि आपका चाइल्ड कंट्रोलर पेरेंट कंट्रोलर की किसी वस्तु को बदलने में सक्षम हो ...।

लेकिन आपके मामले में आप नेस्टेड स्कोप नहीं चाहते हैं, लेकिन सेवाओं से नियंत्रक तक ऑब्जेक्ट प्राप्त करने के लिए एक समान पहलू है।

कहते हैं कि आपके पास आपकी सेवा 'फैक्टरी' है और वापसी की जगह में एक ऑब्जेक्ट है जिसमें ऑब्जेक्टबी है जिसमें ऑब्जेक्ट शामिल है।

यदि आपके नियंत्रक से आप ऑब्जेक्ट को अपने दायरे में लाना चाहते हैं, तो यह कहना गलत है:

$scope.neededObjectInController = Factory.objectA.objectB.objectC;

यह काम नहीं करेगा ... इसके बजाय केवल एक डॉट का उपयोग करें।

$scope.neededObjectInController = Factory.ObjectA;

फिर, DOM में आप objectA से objectC को कॉल कर सकते हैं। यह कारखानों से संबंधित एक सबसे अच्छा अभ्यास है, और सबसे महत्वपूर्ण, यह अप्रत्याशित और गैर-बिल्ली के समान त्रुटियों से बचने में मदद करेगा।

Comments

मुझे लगता है कि यह एक अच्छा जवाब है, लेकिन इसे पचाना बहुत मुश्किल है।

— pspahn

Answer 4

सेवा बनाने के बिना समाधान, $ rootScope का उपयोग करके:

एप्लिकेशन नियंत्रकों में गुणों को साझा करने के लिए आप Angular $ rootScope का उपयोग कर सकते हैं। यह डेटा साझा करने का एक और विकल्प है, इसे डालना ताकि लोगों को इसके बारे में पता चले।

कंट्रोलर्स के पार कुछ कार्यक्षमता साझा करने का पसंदीदा तरीका एक वैश्विक संपत्ति है जिसे आप $ rootcope का उपयोग करने के लिए पढ़ या बदल सकते हैं।

var app = angular.module('mymodule',[]);
app.controller('Ctrl1', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = true;
}]);

app.controller('Ctrl2', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = false;
}]);

टेम्पलेट में $ rootScope का उपयोग करना ($ root के साथ एक्सेस गुण):

<div ng-controller="Ctrl1">
    <div class="banner" ng-show="$root.showBanner"> </div>
</div>

Comments

आप उस बिंदु पर वैश्विक रूप से स्कोप किए गए वैरिएबल का उपयोग कर रहे हैं, जो अपने विभिन्न संरचनाओं के भीतर सब कुछ स्थानीय रूप से स्कूप करने के AngularJS विचार से भटकता है। एक वैश्विक चर फ़ाइल को जोड़ने से एक ही चीज़ प्राप्त होगी और यह पता लगाना आसान होगा कि चर को मूल रूप से कहाँ परिभाषित किया गया है। किसी भी तरह से, सुझाव नहीं दिया गया है।

— २०:४48 बजे आर्गेनिककैट

@Organiccat - मैं आपकी चिंता को समझता हूं और इसीलिए मैंने पहले ही उल्लेख कर दिया है कि पसंदीदा तरीका सेवाओं का होगा, इसमें कोई संदेह नहीं है। लेकिन हां कोणीय इस तरह भी प्रदान करता है। यह आप पर है कि आप अपने वैश्विक प्रबंधन को कैसे प्रबंधित करना चाहते हैं। मेरे पास एक परिदृश्य था जहां इस दृष्टिकोण ने मेरे लिए सबसे अच्छा काम किया।

— संजीव

Answer 5

ऊपर का नमूना एक आकर्षण की तरह काम करता था। मैंने अभी-अभी एक संशोधन किया है कि मुझे कई मूल्यों का प्रबंधन करने की आवश्यकता है। आशा है कि ये आपकी मदद करेगा!

app.service('sharedProperties', function () {

    var hashtable = {};

    return {
        setValue: function (key, value) {
            hashtable[key] = value;
        },
        getValue: function (key) {
            return hashtable[key];
        }
    }
});

Comments

मैंने विभिन्न नियंत्रकों में डेटा साझा करने के लिए एक सेवा का उपयोग करके एक नमूना भी बनाया। मुझे उम्मीद है आप लोगों को यह पसंद है। jsfiddle.net/juazammo/du53553a/1

— जुआन ज़मोरा

हालांकि यह काम करता है, यह आमतौर पर के लिए वाक्यविन्यास है .factory। एक .serviceका उपयोग "यदि आप अपनी सेवा को एक प्रकार / वर्ग के रूप में परिभाषित करते हैं" docs.angularjs.org/api/auto/service/$provide#service

— दिमित्री

दिमित्री, आप सही हैं, हालांकि मेरे दृष्टिकोण से कोणीय लोग हैं, बस थोड़ी सी अवधारणा को मैंने सेवाओं (facades) और कारखानों के बीच बदल दिया है .... ओह ठीक है ....

— जुआन ज़मोरा

और गलत होने पर मुझे सही करें, सेवाओं का उद्देश्य कुछ ऐसा लौटना है जो एक वस्तु या एक मूल्य हो सकता है। ऑब्जेक्ट बनाने के लिए कारखानों का इरादा है। एक पहलू जो वास्तव में कार्यात्मकताओं का एक संग्रह है जो कुछ लौटाता है, यही वह है जो मैंने सोचा था कि सेवाएं कहां हैं। जिसमें कारखानों से प्राप्त कार्यात्मकताएं शामिल हैं। फिर से, यह मेरे लिए क्या है की मूल धारणा में हो रही है और वास्तव में कोणीय दृष्टिकोण से नहीं है। (एब्सट्रैक्ट फ़ैक्ट्री dofactory.com/net/abstract-factory-design-pattern ) और एक एडॉप्टर अप्रोच है जिसे मैं एक सेवा के रूप में उजागर करूँगा

— जुआन ज़मोरा

यहाँ एडॉप्टर पैटर्न की जाँच करें dofactory.com/net/adapter-design-pattern

— Juan Zamora

Answer 6

मैं मूल्यों का उपयोग करता हूं, किसी के लिए भी खुश हूं कि यह एक बुरा विचार क्यों है।

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

myApp.value('sharedProperties', {}); //set to empty object - 

फिर एक सेवा के अनुसार मूल्य इंजेक्ट करें।

Ctrl1 में सेट करें:

myApp.controller('ctrl1', function DemoController(sharedProperties) {
  sharedProperties.carModel = "Galaxy";
  sharedProperties.carMake = "Ford";
});

और ctrl2 से पहुंच:

myApp.controller('ctrl2', function DemoController(sharedProperties) {
  this.car = sharedProperties.carModel + sharedProperties.carMake; 

});

Comments

किसी सेवा का उपयोग करने से यह कैसे अलग है?

— डोपाट्रमन

Answer 7

निम्न उदाहरण दिखाता है कि भाई-बहनों के नियंत्रकों के बीच चर कैसे पारित करें और मूल्य बदलने पर कोई कार्रवाई करें।

उदाहरण का उपयोग करें: आपके पास एक साइडबार में एक फिल्टर है जो दूसरे दृश्य की सामग्री को बदलता है।

angular.module('myApp', [])

  .factory('MyService', function() {

    // private
    var value = 0;

    // public
    return {
      
      getValue: function() {
        return value;
      },
      
      setValue: function(val) {
        value = val;
      }
      
    };
  })
  
  .controller('Ctrl1', function($scope, $rootScope, MyService) {

    $scope.update = function() {
      MyService.setValue($scope.value);
      $rootScope.$broadcast('increment-value-event');
    };
  })
  
  .controller('Ctrl2', function($scope, MyService) {

    $scope.value = MyService.getValue();

    $scope.$on('increment-value-event', function() {    
      $scope.value = MyService.getValue();
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp">
  
  <h3>Controller 1 Scope</h3>
  <div ng-controller="Ctrl1">
    <input type="text" ng-model="value"/>
    <button ng-click="update()">Update</button>
  </div>
  
  <hr>
  
  <h3>Controller 2 Scope</h3>
  <div ng-controller="Ctrl2">
    Value: {{ value }}
  </div>  

</div>

Answer 8

मैं इस प्रश्न पर योगदान करना चाहूंगा कि नियंत्रकों और यहां तक ​​कि निर्देशों के बीच डेटा साझा करने के लिए अनुशंसित तरीका, सेवाओं (कारखानों) का उपयोग करके है क्योंकि यह पहले से ही इंगित किया गया है, लेकिन मैं भी एक प्रदान करना चाहूंगा कैसे किया जाना चाहिए का व्यावहारिक उदाहरण काम कर रहा है।

यहाँ काम कर रहा प्लंकर है: http://plnkr.co/edit/Q1VdKJP2tpvqqJL1LF6m?p=info

सबसे पहले, अपनी सेवा बनाएं , जो आपके पास होगी साझा डेटा होगा :

app.factory('SharedService', function() {
  return {
    sharedObject: {
      value: '',
      value2: ''
    }
  };
});

फिर, बस इसे अपने पर इंजेक्ट करें नियंत्रकों और अपने दायरे में साझा किए गए डेटा को पकड़ो:

app.controller('FirstCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

app.controller('SecondCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

app.controller('MainCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

आप अपने लिए भी ऐसा कर सकते हैं निर्देशों के लिए , यह उसी तरह से काम करता है:

app.directive('myDirective',['SharedService', function(SharedService){
  return{
    restrict: 'E',
    link: function(scope){
      scope.model = SharedService.sharedObject;
    },
    template: '<div><input type="text" ng-model="model.value"/></div>'
  }
}]);

आशा है कि यह व्यावहारिक और स्वच्छ उत्तर किसी के लिए सहायक हो सकता है।

Answer 9

आप सेवाओं या कारखानों के साथ ऐसा कर सकते हैं। वे मूल रूप से कुछ मुख्य अंतरों के लिए समान हैं। मुझे यह स्पष्टीकरण थिंकटर.आईओ पर मिला, जो सबसे आसान है। सरल, टू द पॉइंट और प्रभावी।

Comments

"आप सेवाओं या कारखानों के साथ ऐसा कर सकते हैं" - कैसे ..? यह कैसे करना है कि ओपी क्या पूछ रहा है ... कृपया स्टैकओवरफ्लो में पूरा जवाब पोस्ट करें बाहरी संसाधनों से लिंक करने के बजाय, लिंक ओवरटाइम नीचे जा सकते हैं।

— TJ

Answer 10

क्या आप स्कॉप्स पैरेंट की संपत्ति का हिस्सा भी नहीं बन सकते?

$scope.$parent.property = somevalue;

मैं यह नहीं कह रहा कि यह सही है लेकिन यह काम करता है।

Comments

लेखक ने कहा कि NOTE: These controllers are not nested inside each other.। यदि ये नेस्टेड कंट्रोलर या कंट्रोलर थे जो एक ही माता-पिता को साझा करते थे तो यह काम करेगा, लेकिन हम यह उम्मीद नहीं कर सकते।

— क्रिस फोस्टर

आमतौर पर यह भरोसा करने के लिए एक बुरा अभ्यास है $parentकि क्या इससे बचा जा सकता है। एक अच्छी तरह से डिजाइन किए गए पुन: प्रयोज्य घटक को इसके माता-पिता के बारे में नहीं जानना चाहिए।

— दिमित्री जैतसेव

Answer 11

आह, एक और विकल्प के रूप में इस नए सामान का एक सा है। यह स्थानीय क्षेत्र है, और जहां कोणीय काम करता है। आपका स्वागत है। (लेकिन वास्तव में, लड़के को धन्यवाद)

https://github.com/gsklee/ngStorage

अपनी चूक को परिभाषित करें:

$scope.$storage = $localStorage.$default({
    prop1: 'First',
    prop2: 'Second'
});

मूल्यों तक पहुँचें:

$scope.prop1 = $localStorage.prop1;
$scope.prop2 = $localStorage.prop2;

मूल्यों को संग्रहीत करें

$localStorage.prop1 = $scope.prop1;
$localStorage.prop2 = $scope.prop2;

अपने ऐप में ngStorage और अपने नियंत्रक में $ localStorage इंजेक्षन करना याद रखें।

Comments

यह एक अलग समस्या हल करता है - लगातार भंडारण। यह प्रश्न में समस्या के लिए एक स्केलेबल समाधान नहीं है क्योंकि यह आपके कोड को साइड-इफेक्ट्स के साथ लीक कर देता है जैसे कि स्थानीय भंडारण ऑब्जेक्ट को दूसरों के बीच नाम क्लैश की भेद्यता के साथ संशोधित करना।

— दिमित्री ज़िटसेव

Answer 12

इसे करने के दो तरीके हैं

1) उपयोग / सेट सेवा प्राप्त करें

2) $scope.$emit('key', {data: value}); //to set the value

 $rootScope.$on('key', function (event, data) {}); // to get the value

Answer 13

दूसरा दृष्टिकोण:

angular.module('myApp', [])
  .controller('Ctrl1', ['$scope',
    function($scope) {

    $scope.prop1 = "First";

    $scope.clickFunction = function() {
      $scope.$broadcast('update_Ctrl2_controller', $scope.prop1);
    };
   }
])
.controller('Ctrl2', ['$scope',
    function($scope) {
      $scope.prop2 = "Second";

        $scope.$on("update_Ctrl2_controller", function(event, prop) {
        $scope.prop = prop;

        $scope.both = prop + $scope.prop2; 
    });
  }
])

---

Html:

<div ng-controller="Ctrl2">
  <p>{{both}}</p>
</div>

<button ng-click="clickFunction()">Click</button>

अधिक जानकारी के लिए देखें:

http://plnkr.co/edit/cKVsPcfs1A1Wwlud2jtO?p=preview

Comments

केवल तभी काम करता है जब Ctrl2(श्रोता) का बच्चा नियंत्रक होता है Ctrl1। सिबलिंग कंट्रोलर्स के माध्यम से संवाद करना होता है $rootScope।

— हर्जब्यूब

Answer 14

यदि आप सेवा नहीं करना चाहते हैं तो आप इस तरह से कर सकते हैं।

var scope = angular.element("#another ctrl scope element id.").scope();
scope.plean_assign = some_value;

Comments

मुझे संदेह नहीं है कि यह जवाब काम करता है, लेकिन मैं यह नोट करना चाहता हूं कि यह AngularJS के दर्शन के खिलाफ जाता है कि आपके मॉडल / नियंत्रक कोड में DOM ऑब्जेक्ट्स कभी नहीं होंगे।

— जोकूल

-1 क्योंकि DOM के जरिए कंट्रोलर कम्युनिकेशन मेरी राय में खराब प्रैक्टिस है।

— क्रिस फोस्टर

@ क्रिसफॉस्टर, सिर्फ इसलिए कि एक हथौड़ा "उपकरण" के रूप में बेचा जाता है, इसका मतलब यह नहीं है कि इसे एक पेपर वजन के रूप में इस्तेमाल नहीं किया जा सकता है। मुझे यकीन है कि हर फ्रेमवर्क या टूल के लिए आपको हमेशा ऐसे डेवलपर मिलेंगे, जिन्हें "बेस्ट प्रैक्टिस" की सूची में "झुकना" चाहिए।

— आंद्रेई V

@AndreiV - बेचारी सादृश्यता, एक हथौड़े को कागज के वजन के रूप में उपयोग करने का कोई नुकसान नहीं है। इस तरह के बुरे अभ्यास से स्पष्ट नुकसान होते हैं और आसानी से स्पेगेटी कोड हो सकता है। उपरोक्त कोड नाजुक है क्योंकि यह अब इस बात पर निर्भर करता है कि आपका नियंत्रक DOM में कहां है और परीक्षण करना बहुत कठिन है। एक सेवा का उपयोग करना एक कारण के लिए बेहतर अभ्यास है, क्योंकि यह आपके कार्यान्वयन को आपके टेम्पलेट में नहीं बाँधता है। मैं मानता हूं कि डेवलपर्स को अक्सर सर्वोत्तम प्रथाओं की सूची को मोड़ने की आवश्यकता होती है, लेकिन तब नहीं जब एक स्पष्ट, सामान्य, अधिक मॉड्यूलर सबसे अच्छा अभ्यास होता है जो बेहतर काम करता है।

— क्रिस फोस्टर

Answer 15

$ RootScope और सेवाओं के अलावा, साझा डेटा जोड़ने के लिए कोणीय का विस्तार करने के लिए एक साफ और आसान वैकल्पिक समाधान है:

नियंत्रकों में:

angular.sharedProperties = angular.sharedProperties 
    || angular.extend(the-properties-objects);

यह गुण 'कोणीय' वस्तु के हैं, जो कि स्कोप्स से अलग है, और स्कोप और सेवाओं में साझा किया जा सकता है।

इसका 1 लाभ यह है कि आपको ऑब्जेक्ट को इंजेक्ट करने की आवश्यकता नहीं है: वे आपके बचाव के तुरंत बाद कहीं भी पहुंच योग्य हैं!

Comments

यह पूरे windowऑब्जेक्ट में वैश्विक चर होने जैसा है ... यदि आप कोणीय को प्रदूषित करने जा रहे हैं , तो बस आगे क्यों न जाएं और विंडो ऑब्जेक्ट को प्रदूषित करें ...

— TJ