將模型屬性直接綁定到AngularJS中另一個模型的計算屬性？

Question

我剛開始用AngularJS創建一個小項目。

由於結構上的原因，我想我分解模型在幾個子模型，像這樣：

var myCtrl = function ($scope) { 

    $scope.mainModel = [ 
     {modelTitle:'learn angular', sum:0}, 
     {modelTitel:'build an angular app', sum:0} 
    ]; 

    $scope.subModel1 = [ 
     {item:'learn angular', value:2}, 
     {item:'build an angular app', value:2} 
    ]; 

    $scope.subModel2 = [ 
     {item:'learn angular', value:5}, 
     {item:'build an angular app', value:5} 
    ]; 

} 

假設，即中subModel1和subModel2結果是他們的項目值的必需的總和。

因此，subModel1總和爲4和subModel2總和爲10

如何編程結合mainModel[0].sum到subModel1總和，同樣也subModel2？

更新：剛剛發現AngularJS Fundamentals in 60-ish Minutes作者：Dan Wahlin。一個美麗的介紹，主要關注核心概念。

Answer 1

如果您只需要在您的視圖中的值，你可以定義在$範圍功能：

$scope.mainSum = function() { 
    return $scope.subModel1[0].value + $scope.subModel2[0].value; 
} 

，然後在視圖中使用它：

<div>main sum = {{mainSum()}}</div> 

如果您需要mainModel到更新，做@Tim已經在評論中建議的內容 - 在您的控制器中使用$watch es：

$scope.$watch('subModel1[0].value', function(value) { 
    $scope.mainSum[0].sum = value + $scope.subModel2[0].value; 
}); 
$scope.$watch('subModel2[0].value', function(value) { 
    $scope.mainSum[0].sum = $scope.subModel1[0].value + value; 
}); 

您也可以觀看總和：

$scope.$watch(function() { 
    return $scope.subModel1[0].value + $scope.subModel2[0].value; 
}, function(value) { 
    $scope.mainSum[0].sum = value; 
});