将不同的函数绑定到AngularJS中的不同选项

I am in need to do such thing

我需要做这样的事情

<select>
  <option ng-sth="firstMethodToBeCalled()">Option 1</option>
  <option ng-sth="secondMethodToBeCalled()">Option 2</option>
<select>

Is there any way to do this? I need this because i currently have this kind of code:

有没有办法做到这一点?我需要这个,因为我目前有这样的代码:

<select ng-model="someModel" ng-change="callThisFunction()">
  <option value="value1">Option 1</option>
  <option value="value2">Option 2</option>
  ...
  <option value="valueN">Option N</option>
</select>

And I want to add only two more options to this Select but calling different function. I can refactor it to call same wrapper function and determine which final function shall be called with some conditional logic but I am wondering if there is a possibility to assign different. I have been looking for this for some time and didn't come across any solution.

而且我想只为这个Select添加两个选项,但调用不同的功能。我可以重构它来调用相同的包装函数并确定哪些最终函数应该用一些条件逻辑调用,但我想知道是否有可能分配不同的。我一直在寻找这个,并没有遇到任何解决方案。

2 个解决方案

#1

Unfortunately, i'm afraid you can't.

不幸的是,我担心你不能。

By the way, i would keep to have single function in ng-change and the put some logic inside it (and call your second function too from there), like this:

顺便说一句,我会继续在ng-change中使用单个函数并在其中放入一些逻辑(并从那里调用你的第二个函数),如下所示:

$scope.callThisFunction = function(){
   if(someModel == "baz")
      myFirstfunction();
   else
      mySecondFunction();
}

it's the cleanest solution in my opinion, and the most mantainable.

这是我认为最干净的解决方案,也是最可持续的解决方案。

#2

Yes ! there is a way you can achieve this.Create a functions object with keys as your selected option which is your ng-model and value as a function aligned to it and performa ny action in it.

是的!有一种方法可以实现这一点。使用键作为您选择的选项创建一个函数对象,这是您的ng-model和value作为与其对齐的函数,并执行其中的performa ny操作。

In your JS

在你的JS中

$scope.functions ={
    "value1":function(){
        console.log("function for option 1 called");
    },"value2":function(){
        console.log("function for option 2  called");
    }
};

In your HTML

在你的HTML中

<select ng-model="someModel" ng-change="functions[someModel]()">
  <option value="value1">Option 1</option>
  <option value="value2">Option 2</option>
  ...
  <option value="valueN">Option N</option>
</select>

Call the functions object in your ng-change by passing the your ng-model which is selected option which will invoke corresponding function.

通过传递选择的ng-model选项调用ng-change中的函数对象,该选项将调用相应的函数。

#1