如何在单击时添加许多功能?


293

我一直在寻找如何执行此操作,但到目前为止我还没有找到任何相关的东西,:(我可以嵌套两个函数,但是我只是想知道这是否可行吗?我想从字面上做到这一点:

<td><button class="btn" ng-click="edit($index) open()">Open me!</button></td>

目前我的JS代码:

$scope.open = function () {
  $scope.shouldBeOpen = true;
};      

$scope.edit = function(index){

  var content_1, content_2;
      content_1 = $scope.people[index].name;
      content_2 = $scope.people[index].age;

  console.log(content_1);
};

我想一键调用两个函数,如何在angularJS中做到这一点?我认为当您添加多个类时,它将像在CSS中一样简单...但是不是:(

Answers:


652

您有2个选择:

  1. 创建包装这两个方法的第三个方法。这样做的好处是可以减少模板中的逻辑。

  2. 否则,如果您想在ng-click中添加2个通话,则可以添加';' 经过edit($index)这样的

    ng-click="edit($index); open()"

看到这里:http : //jsfiddle.net/laguiz/ehTy6/


1
我已经使用了第二种方法(它需要做什么),但是为什么没有一个调用有两个调用又有什么原因ng-click呢?
戴夫·埃弗里特

1
这就是为什么我给了2个选择。就我个人而言,我更喜欢将呼叫包装在控制器中,但这取决于您。
Maxence

4
选项2没问题,但是选项1更干净,因为您应该避免在视图中添加代码和逻辑。如果将来需要修改某些内容,那就更好了。
Dani Barca Casafont 2014年

5
就我自己而言,选项2意味着避免在指令内部添加通用函数,这可能会更慢,而且绝对难以维护。
亚历克斯(Alex)

2
选项1还为您提供了另外一项无需测试的功能
Parris Varney

18

您可以使用“;”调用多个函数

ng-click="edit($index); open()"

8

很多人使用(单击)选项,所以我也将分享这一点。

<button (click)="function1()" (click)="function2()">Button</button>

4
使用(click)=“ function(); function2()”也可以。我只是发现了并想分享。
amlane86 '19

当绑定到时,我发现这很有用keyup.enter。该;分离没有工作,因为这些方法并不总是为了执行。
xandermonkey

2

尝试这个:

  • 收集功能
  • 创建一个循环并执行集合中所有功能的函数。
  • 将函数添加到html
array = [
    function() {},
    function() {},
    function() {}
]

function loop() {
    array.forEach(item) {
        item()
    }
}

ng - click = "loop()"

1

按照下面

ng-click="anyFunction()"

anyFunction() {
   // call another function here
   anotherFunction();
}

-15
ng-click "$watch(edit($index), open())"

1
此处的语法不正确。如上所述,分号是分隔符。不是逗号...等等...
Erik Grosskurth
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.