如何在一个ng点击添加许多功能?

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

<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中添加多个类一样简单…但它不是:(

405094 次浏览
小开
最佳答案

你有两个选择:

  1. 创建包含这两个方法的第三个方法。这样做的优点是可以在模板中放入更少的逻辑。

  2. 否则，如果你想在ng-click中添加2次调用，你可以在edit($index)之后添加';'，就像这样

    ng-click="edit($index); open()" < / p >

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

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

使用';'可以调用多个函数

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

试试这个:

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


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


ng - click = "loop()"
小开

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

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

遵循以下步骤

ng-click="anyFunction()"


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

添加多重功能的标准方法

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

或

<button (click)="removeAt(element.bookId)" (click)="openDeleteDialog()"> Click Here</button>
小开 
                <!-- Button trigger modal -->
<button type="button" (click)="open(content)" style="position: fixed;  bottom: 0;  right: 130px;"
class="btn col-sm-1  btn-Danger" >
Reject
</button>
                  

                  



<ng-template #content let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">Profile update</h4>
<button type="button" class="btn-close" aria-label="Close" (click)="modal.dismiss('Cross click')"></button>
</div>
<div class="modal-body">
                     

<div class="mb-3">
<label class="bg-danger text-light" for="Reject">Reason For reject</label>
                          

<textarea   matInput placeholder="  Reject" [(ngModel)]="asset_note">\{\{note}}</textarea>
                

</div>
</div>
<div class="modal-footer">
<!-- -->
<button type="button" class="btn btn-outline-dark" (click)="reject();modal.close('Save click') ">Save</button>
</div>
</ng-template>




**.ts file**
open(content: any) {
this.modalService.open(content, {ariaLabelledBy: 'modal-basic-title'}).result.then((result) => {
this.closeResult = `Closed with: ${result}`;
}, (reason) => {
this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
});
}


private getDismissReason(reason: any): string {
if (reason === ModalDismissReasons.ESC) {
return 'by pressing ESC';
} else if (reason === ModalDismissReasons.BACKDROP_CLICK) {
return 'by clicking on a backdrop';
} else {
return `with: ${reason}`;
}
}




close()
{


this.getDismissReason(ModalDismissReasons.ESC);
}
小开

以下哪一个是最佳实践(option1或option2)

  1. < p > & lt;按钮(点击)=“removeAt (element.bookId);openDeleteDialog()“比;点击这里

  2. < p > & lt;按钮(点击)=“removeAt (element.bookId)“;(点击)=“openDeleteDialog()“比;点击这里


提交答案