एंजुलरजेएस नियंत्रक

Question

से jQuery को ठीक तरह से कॉल करने के लिए कैसे मैं AngularJS के साथ jQuery-UI टैब का उपयोग करने का प्रयास कर रहा हूं।

उदाहरण here

समस्या है कि नियंत्रक में jQuery("#tabs").tabs(); बुला क्या कुछ "tabbify" करने के लिए आवश्यक है की "आधा" ऊपर हुक करने लगता है देखें।

विचार?

Answer 1

आपको अपने नियंत्रक में डोम मैनिपुलेशन नहीं करना चाहिए - बिल्कुल। इसके बजाय, आपको निर्देशों का उपयोग करना चाहिए।

मैं अपने खुद के इस्तेमाल के लिए निर्देशों का एक सेट विकसित किया गया है

.directive('maketab',function() { 
     return function(scope, elm, attrs) { 
      elm.tabs({ 
       show: function(event, ui) { 
         scope.$broadcast("tabChanged",ui); 
       } 
      }); 
     }; 
    }) 

फिर, div में: https://github.com/ganarajpr/Angular-UI-Components

दर्शन सिर्फ निर्देशों फ़ाइल में कोड की इस सरल टुकड़े ड्रॉप करने के लिए है जो आपको एक टैब में तब्दील करना चाहते हैं:

<div id="mytab" maketab> 

<ul> 
.... 
</ul> 

<div>...</div> 
... 
</div> 

ध्यान दें कि div और उसके बच्चे संरचनाओं क्या JQuer के अनुरूप होना चाहिए वाई यूआई यह होने के लिए पूछता है।

अधिक मजबूत उदाहरण और अधिक घटकों के लिए, जिथब रेपो देखें।