कोणीयजेएस और बूटस्ट्रैप के विभाजन बटन ड्रॉपडाउन

Question

क्या आपको पता है कि किसी ने अंगुलरजेएस को बूटस्ट्रैप की स्क्रिप्ट को पोर्ट किया है?

मुझे अपने ऐप के लिए बूटस्ट्रैप के split button dropdown की आवश्यकता है और मैं वास्तव में jQuery को खींचने से बचाना चाहता हूं। मुझे यह पता लगाने में असफल रहा।

Answer 1

देखो: http://jsfiddle.net/guillaumebiton/8muRC/

केवल कोणीय की शक्ति:

<div class="btn-group" ng-class='{open: open}'> 
    <button class="btn">Action</button> 
    <button class="btn dropdown-toggle" data-toggle="dropdown" ng-click='open=!open'> 
     <span class="caret"></span> 
    </button> 
    <ul class="dropdown-menu"> 
     <li><a href="#">Action</a></li> 
     <li><a href="#">Another action</a></li> 
     <li><a href="#">Something else here</a></li> 
     <li class="divider"></li> 
     <li><a href="#">Separated link</a></li> 
    </ul> 
</div> 

यह केवल का उपयोग एक चर 'खुला' जो सही या गलत है।

Answer 2

कोणीय-यूई के हिस्से के रूप में हम शुद्ध कोणीयजेएस में बूटस्ट्रैप के विजेट बनाने पर काम कर रहे हैं (तीसरे पक्ष के जेएस libs पर निर्भरता, केवल निर्भरता बूटस्ट्रैप के सीएसएस के साथ)।

भंडार यहाँ स्थित है: https://github.com/angular-ui/bootstrap

इस प्रगति में बहुत ज्यादा काम है लेकिन वहाँ लटकती-टॉगल पहले से ही निर्देश है:

<div ng-controller="MyCtrl"> 
    <div class="btn-group"> 
     <a class="btn dropdown-toggle"> 
     Actions 
     <span class="caret"></span> 
     </a> 
     <ul class="dropdown-menu"> 
      <li><a>Action 1</a></li> 
      <li><a>Action 2</a></li> 
     </ul> 
    </div> 
</div> 

: https://github.com/angular-ui/bootstrap/blob/master/src/dropdownToggle/dropdownToggle.js

आप इसे इस तरह इस्तेमाल कर सकते हैं

कृपया ध्यान दें कि यह निर्देश कक्षा स्तर पर संचालित है, इसलिए यह dropdown-toggle कक्षा को परिचालित करने के लिए पर्याप्त है!

एक बार फिर, यह प्रगति पर है (पूरा प्रयास 2-3 हफ्ते पहले कुछ शुरू हुआ) तो बग रिपोर्ट/पुल अनुरोधों का बहुत स्वागत है! इस डेमो में

Answer 3

आप इस निर्देश जो AngularJS बूटस्ट्रैप के लटकती में सलेक्ट बॉक्स धर्मान्तरित आज़मा सकते हैं: http://jsfiddle.net/M32pj/28/ `नमूना:

<select ng-model="example1" bs-selectbox> 
<option value="1">One</option> 
<option value="2">Two</option> 
</select> 

`