如何在兩個輸入框中的任意一個輸入框中有輸入時自動將輸入框的值設置爲相反的數字？

Question

比方說，我們有2個輸入框：

1. NUM1
2. NUM2

當用戶在任何2名輸入框中輸入一個數字，我們希望發生的自動設置另一個輸入框的值與數字的相反符號相關聯。

實例：

• 用戶輸入1中NUM1。 num2的值應自動設置爲 爲-1。
• 用戶在num1中輸入-1。 num2的值應自動設置爲 爲1.

使用AngularJS 1.x時，我們該如何實現這一點？

Answer 1

有幾個方法可以做到這一點：

1. 在你的控制器派人監視NUM1和NUM2的值。它可能是這個樣子（假設$範圍在你的控制器注入）

例HTML

<input type="number" ng-model="num1"> 
<input type="number" ng-model="num2"> 

例JS

$scope.$watch('num1', function(newVal){ 
    $scope.num2 = - newVal; 
} 

$scope.$watch('num2', function(newVal){ 
    $scope.num1 = - newVal; 
} 

這種方式是最好，如果你打算重用控制器具有多個視圖，或者模型數據（num1和num2）之間存在固有關係。如果因爲任何原因（其他綁定，javascript顯式更改等）發生更改，手錶將觸發。

在您的輸入有一個NG-變化的角度表達式中設置的值，如果你

例HTML

<input type="number" ng-model="num1" ng-change="num2=-num1"> 
<input type="number" ng-model="num2" ng-change="num1=-num2"> 

這種方式是優選的只關心一個數字，或者這個邏輯只屬於視圖。它也可以更高效，因爲它鉤住了變化事件而不是做和等價檢查每個摘要循環。但是，這意味着如果通過除了改變該輸入框之外的其他方式來改變其中一個數字，則該改變將不會被反映。感謝Manatax在下面的評論中指出了大部分好處。