在ng-click指令中調用多個函數是否有缺點？

Question

我們在一個ng-click指令中調用兩個函數，有沒有我們應該知道的問題？

<button type="button" ng-click="func1(); func2();">Click</button>

我們也可以調用一個調用這兩個函數的函數：

<button type="button" ng-click="func1()">Click</button>

$scope.func1(){
  func2();
}

$scope.func2(){
 //something
}

Answer 1

沒有區別，它們都可以和另一個（在我看來更好）選項一樣有效

<button type="button" ng-click="clickAction()">Click</button>

$scope.clickAction = function() {
    $scope.func1();
    $scope.func2();
};

Answer 2

在一次ng-click中調用兩個函數是一種不好的做法。 當您決定要添加第三個功能時會發生什么？ 如果您只希望在滿足某個條件時發生第二個功能，該怎么辦？ 在您的演示代碼中添加超出必要的邏輯是關注點分離不佳。

Answer 3

是的，第一種方法是正確的。 ng-click詢問一個有效的AngularJS expression並進行評估，無論是單個函數還是多個函數，還是任何其他表達式，如"anyVar = 'Button Clicked'"

以下這些例子都是正確的

<button type="button" ng-click="func1(); func2();">Click</button>

要么

<button type="button" ng-click="anyVar = 'Button Clicked'; index++;">Click</button>

Answer 4

兩種方式都沒有問題，但我只在$scope聲明了一個函數，而在JS中只聲明了另外兩個函數：

<button type="button" ng-click="func3();">Click</button>

func1() {
  // something
}

func2() {
  // something
}

$scope.func3 = function() {
  func1();
  func2();
}

Answer 5

所有方法都是正確的。 但是我們可以將這兩個函數func1()和func2()作為JS函數而不是scope函數，並使用ng-click在新的作用域函數中調用它們。

HTML代碼：

<button type="button" ng-click="click()">Button</button>

控制器代碼：

function func1() {
    // func1 code goes here
}

function func2() {
    // func2 code goes here
}

$scope.click = function() {
    func1();
    func2();
}

與在ng-click上添加兩個函數相比，此實現具有一些優點

• 首先，它減少了觀察者的數量，因為我們只有一個 scope函數，而向ng-click添加兩個函數需要您在scope定義兩個函數。
• 第二，如果運行你的func2()是有條件的，即它依賴於func1()輸出，你可以決定是否運行func2() 。

Answer 6

沒有沒有缺點，但這不是一個好的做法...無論你是在ng-click內部調用函數還是在控制器中的另一個函數內部都沒有區別。 如果你在ng-click中調用函數，那么它們將按順序調用它們在那里寫入。

例如：func1（）將首先調用然后調用func2（）...

Answer 7

不，在ng-click中調用多個函數沒有任何缺點，但我們必須在大多數時候忽略它，因為這不是一個好習慣。

您可以通過調用另一個函數內的函數來實現此目的。

<button type="button" ng-click="func1(); func2(); func3();">Click</button>

所以這里func1首先調用，然后調用func2和func3。