如何在每次从下拉菜单中选择项目时触发不同的功能

how to trigger a diffrent function each time an item is selected from a dropdown menu

本文关键字:功能 项目 选择 下拉菜单      更新时间:2023-09-26

我有一个下拉菜单值一,二,三和三个不同的函数如何触发每个函数当我选择一个值例如,如果我选择一个函数一个触发器如果我选择值两个函数两个触发器等

<select class='mapDropDown' ng-options='x for x in name' ng-model='selectedFunction'>
<option value=''> Please Select </option>
</select>

app.js

 function MyCtrl($scope) {
        $scope.name = ['one', 'two', 'three']
        function one(){
        alert('you triggered first function')
        }
        function two(){
        alert('you triggered second function')
        }
        function three(){
        alert('you triggered second function')
        }
    }

jsfiddle

您可以传递当前选定值myFunction方法&然后那个方法将决定如何调用其他方法,就像下面的选择框的改变。为了使其生效,您需要将所有函数置于作用域中。

标记

<select class='mapDropDown' ng-options='x for x in name' ng-model='selectedFunction'
  ng-change="myFunction(selectedFunction)">
   <option value=''> Please Select </option>
</select>

$scope.myFunction = function(functionName){
   $scope[functionName]();
}

如果你不想把方法放在$scope中,你可以把它们放在服务中并调用它们,就像我们在第一种方法中所做的那样。如果你想把function留在控制器中,而不是添加到作用域中,你可以使用下面的function

$scope.myFunction = function(functionName) {
   eval(functionName+'()')
}
演示小提琴

$('.mapDropDown').change(function(){
 functionName = this.value; 
 function(functionName){
   $scope[functionName]();
 }
})