ड्रॉपडाउन बटन कैसे बनाएं जो इसके शीर्षक को बदलता है अलग-अलग लिंक हैं?

Question

अभी तक मैंने क्लिक किए गए आइटम के आधार पर अपना शीर्षक बदलने के लिए बूटस्ट्रैप ड्रॉपडाउन बटन प्राप्त करने में कामयाब रहा है।

Codepen

लेकिन उस के अलावा मैं जब उन पर क्लिक हर लटकती आइटम अपने स्वयं के लिंक करना चाहते हैं।

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

एचटीएमएल

<div ng-app='myApp'> 
    <div ng-controller='DropdownCtrl'> 

    <div class="btn-group" uib-dropdown is-open="status.isopen"> 
     <button id="single-button" type="button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="disabled"> 
     {{button}} <span class="caret"></span> 
     </button> 
     <ul class="uib-dropdown-menu" role="menu" aria-labelledby="single-button"> 
     <li role="menuitem"> 
      <a href="#" ng-click="change(action)" ng-repeat="action in actions">{{action}}</a> 
     </li> 
     </ul> 
    </div> 

    </div> 
</div> 

सीएसएस

angular.module('myApp', ['ui.bootstrap']).controller('DropdownCtrl', function($scope) { 
    $scope.button = "Button dropdown"; 
    $scope.actions = [ 
    "Action", "Another Action", "Something else here" 
    ]; 

    $scope.change = function(name){ 
    $scope.button = name; 
    } 
}); 

Answer 1

कुछ इस तरह करते हैं, ng-href

पहले एक लंगर के लिए बटन को बदलने का प्रयोग और एनजी-href विशेषता जोड़ें;

<a href ng-href="{{ href }}" id="single-button" class="btn btn-primary" uib-dropdown-toggle ng-disabled="disabled"> 
    {{ name }} <span class="caret"></span> 
</a> 

फिर उन गतिविधियों में ऑब्जेक्ट की श्रृंखला आयोजित करने की चर बदल:

$scope.actions = [ 
    { 
     name: 'Action', 
     href: 'action.html' 
    }, 
    { 
     name: 'Another Action', 
     href: 'another_action.html' 
    }, 
    { 
     name: 'Something else here', 
     href: 'something_else_here.html' 
    } 
]; 

फिर अंत में कार्रवाई और href

$scope.change = function(action){ 
    $scope.name = action.name; 
    $scope.href = action.href; 
} 

के नाम अद्यतन करने के लिए परिवर्तन कार्यप्रणाली के साथ छेड़छाड़

संपादित करें अब CodePen example के साथ। ध्यान दें कि मैंने बटन को एक स्प्लिट बटन में बदल दिया है (अन्यथा href का कोई उपयोग नहीं है, क्योंकि यह टॉगल द्वारा ओवरराइट किया जाएगा)।

Answer 2

ठीक है, यह करने के लिए कुछ तरीके है, तो आप क्या कर रहे हैं पर निर्भर करता है। यहाँ एक उदाहरण दिया गया है, यदि आप अलग फ़ाइल में दायरे में हर क्रिया है, तो आप इस के समान कुछ कर सकते हैं:

<form name="dropdownctrl> 
<select name="list" accesskey="target"> 
<option selected>Whatever</option> 
<option value="action.html">Action</option> 
<option value="anotheraction.html">Another Action</option> 
<option value="something else.html">something else</option> 
<select> 
<input type=button value="Go" onclick="goToNewPage(document.dropdown.list)">