需要將數組元素的平均數據賦值給ng-model：Angular

Question

我收到了JSON對象，其中有一個數組元素，我希望這些數字數據的平均值並將其分配給視圖中的ng-model。

我的Json對象。

{ 
    "status": "success", 
    "data": [{ 
     "name": "[1] Data 1", 
     "ratings": [4, 5, 5, 5, 3, 5, 4, 5, 3] 
    }, { 
     "name": "[2] Data 2", 
     "ratings": [2, 4, 2, 2, 3, 1, 2, 5] 
    }, { 
     "name": "[3] Data 3", 
     "ratings": [3, 3, 3, 3, 3, 3, 3, 3] 
    }] 
} 

現在看來，我想「收視率」的數據平均分配到UIB評級的NG-模型

我查看

<ul class="video-list"> 
     <li ng-repeat="data in getVideoListsCtrl.result" class="col-sm-3 col-xs-12" ng-click="getVideoListsCtrl.loadSingleVideoAndPlay(data)"> 
      <span class="vname">{{data.name}}</span> 
      <span class="vratings"> 
      <span uib-rating ng-model={{data.ratings | avarageConverter}} max="max" read-only="isReadonly"> 
      </span> 
      </span> 
     </li> 
     </ul> 

我嘗試使用調用功能或應用過濾器。

.filter('avarageConverter', function() { 
    return function (arr) { 
     var sum = 0; 
     for(var i=0; i<arr.length; i++) { 
     sum += arr[i]; 
     } 
     return sum/(arr.length === 0 ? 1 : arr.length); 
    }; 

但它不工作。

Answer 1

您可以將新屬性添加到存儲平均值的JSON對象，然後將其分配給ng-model。一旦你在控制器檢索數據，你可以遍歷data[]並添加新的average財產是平均得分爲項目並在視圖綁定此您ng-model：

<span uib-rating ng-model="data.average" max="max" read-only="isReadonly"></span>

Answer 2

創建DTO在服務器端具有屬性：名稱，評級和平均值。計算服務器端的平均值（您的休息api）並將其返回到DTO中。