角js：爲什麼$ scope.product不更新，如果它是一個變量，如果它是一個函數更新

我是新的角js。我發現了一個問題，但我不知道爲什麼。有人能爲我解釋嗎？萬分感謝。

下面

是我的html文件：

<div ng-controller="index"> 
    <input type="text" ng-model="factor" /> {{product}} 
</div>

下面

是我的js文件：

angular.module("root", []) 
    .controller("index", ["$scope", function($scope) { 
     $scope.factor = 6; 
     $scope.product = $scope.factor * 2; 
    }]);

當我輸入更改爲5，產品的價值不更新爲預計10

，但如果我改變了這樣的代碼下面，一旦產品價值更新爲我改變輸入

HTML：

<div ng-controller="index"> 
    <input type="text" ng-model="factor" /> {{product()}} 
</div>

JS：

angular.module("root", []) 
    .controller("index", ["$scope", function($scope) { 
     $scope.factor = 6; 
     $scope.product = function(){ 
      return $scope.factor * 2 
     }; 
    }]);

來源

2015-12-29 Carina FU

'$ scope.product'只是'scope'變量的初始化，它是沒有得到每次價值變動更新。在'$ scope.product = function'中，消費循環在每次值改變時都會運行。 – Rayon

更好的方法是在'input'上使用'ng-change'並更新範圍變量.. – Rayon

@RayonDabre不是它的兩種方式綁定，如果模型更改，然後視圖也應該更新。 – Jai

在你初始化$scope領域尚屬首例。就是這樣。字段product使用字段factor的值初始化，但字段是獨立的。

在第二種情況下，你定義一個$scope函數product和它的返回值是依賴於$scope字段factor因而$scope.factor任何變化引起$scope.product返回值的變化。

來源

2015-12-29 04:43:32

當頁面呈現，該產品是12，因爲6 * 2 = 12，即使您已爲要素的雙向約束力，但將產品分配係數* 2的代碼不會再次執行。按照註釋中的建議，你應該做的是設置一個ng-change事件，並執行$ scope.product = $ scope.factor * 2;如果您更改該因子，則應該重新綁定頁面。

product（）的工作原理是每次在窗體上進行更改時，都會執行函數。這是非常無效的，因爲如果你有其他領域，產品功能仍然運行，這可能不是你想要的。

試試這個：

HTML：

<div ng-controller="index"> 
    <input type="text" ng-change="factorChanged()" ng-model="factor" /> {{product}} 
</div>

JS：

angular.module("root", []) 
    .controller("index", ["$scope", function($scope) { 
     $scope.factorChanged = function() { 
      $scope.product = $scope.factor * 2; 
     }; 

     $scope.factor = 6; 
     $scope.factorChanged(); 
    }]);

來源

2015-12-29 04:41:16 Will

感謝您回答，就第二種情況而言，我認爲這解釋更合理在$ scope.product =函數中，每次值改變時都會運行消化循環 –

最好的方法是使用$表，請檢查該plunker

app 
.controller("index", ["$scope", function($scope) { 
    $scope.factor = 6; 
    $scope.$watch('factor',function(newValue,oldValue){ 
     $scope.product = newValue *2; 
    }); 
}]);

來源

2015-12-29 06:21:27

角js：爲什麼$ scope.product不更新，如果它是一個變量，如果它是一個函數更新

回答

相關問題