如何在一次 ng-click 中添加许多功能?

IT技术 javascript angularjs
2021-01-24 12:11:04

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

<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 中一样直接......但事实并非如此:(

6个回答

您有 2 个选择:

  1. 创建包装这两种方法的第三个方法。这里的优点是您在模板中放置的逻辑更少。

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

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

见这里:http : //jsfiddle.net/laguiz/ehTy6/

选项 1 还为您提供了另一个必须测试的不必要的功能
2021-03-16 12:11:04
选项 2 没有问题,但选项 1 更清晰,因为您应该避免在视图中添加代码和逻辑。如果您将来需要修改某些内容,那就更好了。
2021-03-22 12:11:04
在我自己的情况下,选项 2 意味着避免在指令中添加公共函数,这可能会更慢,而且肯定更难维护。
2021-03-27 12:11:04
我已经使用了方法二(它可以满足需要),但是有什么理由不能将两个调用合二为一ng-click
2021-03-29 12:11:04
这就是为什么我给出了 2 个选项。我个人更喜欢在我的控制器中包装调用,但这取决于你。
2021-04-04 12:11:04

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

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

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

<button (click)="function1()" (click)="function2()">Button</button>
使用 (click)="function(); function2()" 也可以。我刚刚发现并想分享。
2021-03-14 12:11:04
我发现这在绑定到keyup.enter. ;分离没有工作,因为这些方法并不总是为了执行。
2021-04-06 12:11:04

添加多个功能的标准方法

<button (click)="removeAt(element.bookId); openDeleteDialog()"> Click Here</button>

或者

<button (click)="removeAt(element.bookId)" (click)="openDeleteDialog()"> Click Here</button>

试试这个:

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

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

ng - click = "loop()"