Question

我需要做这样的事情

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

有没有办法做到这一点？我需要这个，因为我目前有这样的代码：

<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>

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

Answer 1

不幸的是，我害怕你不能。

顺便说一下，我会继续在ng-change中使用单个函数并在其中加入一些逻辑（并从那里调用你的第二个函数），如下所示：

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

在我看来，它是最干净的解决方案，而且是最可持续的解决方案。

Answer 2

是的！有一种方法可以实现这一点。创建一个函数对象，使用键作为您选择的选项，即ng-model，将值作为与其对齐的函数，并执行其中的执行操作。

在你的JS中

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

在您的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>

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

将不同的函数绑定到AngularJS

2 个答案: