angular.js how to alter variable value step by step

Question

Here is my html code

<div ng-app='app'>
<div ng-controller="MyController" ng-init="myVar=7">
    {{myVar}}
    <span ng-init="myVar=myVar+5">{{myVar}},</span>
    <span ng-init="myVar=myVar+15">{{myVar}},</span>
    <span ng-init="myVar=myVar+37">{{myVar}},</span>
</div>   

and script

var app = angular.module('app',[]);
app.controller('MyController', function() {});

The output I'm getting is 64,64,64,64

but I want output as 7,12,27,64

I'm trying to find things like ng-repeat but I cant kept these in an array

Answer 1

In every ng-init you're altering the value of myVar that is data bound to all other instances; and that's why they all show the same. So rather do:

<div ng-app='app'>
<div ng-controller="MyController" ng-init="myVar=7">
    {{myVar}}
    <span>{{myVar+5}},</span>
    <span>{{myVar+15}},</span>
    <span>{{myVar+37}},</span>
</div>