angularjs: जब मैं jQuery

Question

के साथ कोई चयन बदलता हूं तो $ स्कोप अपडेट मैं अपने चयन को 'कस्टमाइज़' करने के लिए एक jQuery प्लगइन का उपयोग कर रहा हूं।

यह प्लगइन मूल विकल्प के परिवर्तन ईवेंट को निकालता है जब कुछ विकल्प चुना जाता है।

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

यहां आप एक त्वरित उदाहरण देख सकते हैं ... स्कोप परिवर्तनों को चुनना बदल रहा है। बटनों को चुनिंदा परिवर्तनों पर क्लिक करना, लेकिन दायरा नहीं।

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

मैं क्या याद आ रही है?

Answer 1

अंगुलर के साथ डोम हेरफेर मिश्रण नहीं करना सबसे अच्छा है। अपने बटन के लिए निम्न कोशिश करें एचटीएमएल:

<button class="setVal" ng-click="selectValue=1">Set 1</button> 
<button class="setVal" ng-click="selectValue=2">Set 2</button> 
<button class="setVal" ng-click="selectValue=3">Set 3</button> 

मैंने उपरोक्त आपके प्लंकर में कोशिश की और यह काम किया।/प्रदर्शन करने के लिए

$('button').on('click', function(){ 
    var newVal = $(this).data('val'); 
    $('select').val(newVal).change(); 

    var scope = angular.element($("select")).scope(); 
    scope.$apply(function(){ 
     scope.selectValue = newVal; 
    }); 
}); 

Answer 2

आप जिन्हें आप नीचे लटकती के दायरे का उपयोग और फिर इसे लागू करने की आवश्यकता कुछ क्रियाएं, इसलिए हमें $ scope को कॉल करने की आवश्यकता है। नियंत्रक के दायरे में परिवर्तनों को प्रतिबिंबित करने के लिए $ लागू करें() लागू करें। और इस के लिए अपने नियंत्रक को बदलने:

जिस तरह से आप कोणीय अंदर jQuery घटना का उपयोग कर सकते करके ..

Answer 3

आप बटन क्लिक करते, कोणीय इसके दायरे से बाहर चला जाता है और डेटा हेरफेर करने के लिए jQuery का उपयोग करता है:

Answer 4

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

आप jQuery का उपयोग कर एक ही हासिल करना चाहते हैं, तो यह निर्देश में

$scope.$apply() 

के रूप में गुंजाइश अद्यतन करने के लिए जाना चाहिए।

Answer 5

अपने jQuery में ऑटो ट्रिगर, उदा,

$('#input').click(function(){ 
     $('#input').val('1'); 
     $('#input').trigger('input'); //add this line this will bind $scope Variable 
    });