JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<div ng-app ng-controller="MyCtrl">
    <button ng-click="addValue()">Add value</button>
<div ng-repeat="data in MyData">
    {{ data.income }}
</div>
<div>
    Average: {{avgIncome()}}
</div>
</div>

JavaScript

function MyCtrl($scope) {
    $scope.MyData = [{income:1000}, {income:2000},
                    {income:1200}, {income:4500},
                    {income:3300}, {income:200},
                    {income:4500}, {income:2300}];

    $scope.avgIncome = function() {
        return alasql('SELECT VALUE AVG(income) FROM ?',[$scope.MyData]);
    };
    
    $scope.addValue = function() {
        $scope.MyData.push({income:(Math.random()*1000)|0});
    }
}