Untitled

.bigDiv {
        width: 500px;
        height: 500px;
        margin: 400px auto;
        background-color: black;
    }

    ul {
        font-size: 0px;
        padding-left: 0px;
    }
    .circle {
        width: 20px;
        height: 20px;
        border-radius: 10px;
        background-color: green;
        position: relative;
    }

    .todo-last {
        position: absolute;
        width: 33px;
        height: 33px;
        background-color: red;
        left: 25px;
        top: 25px;
        font-size: 25px;
        color: white;
    }
    .bigDiv li {
        display: inline-block;
        width: 100px;
        height: 100px;
        background-color: purple;
    }


     <body ng-app="app" ng-controller="controller">
     <div class="bigDiv">
         <ul>
             <li ng-repeat="todo in todoArray">
                 <div class="circle">
                     <div class="todo-last">
                         {{todo.text}}
                     </div>
                 </div>
             </li>
         </ul>
     </div>
</body>

<script>
      var app = angular.module('app',[]);
       app.controller('controller',["$scope",function ($scope) {
           var randomNum = Math.ceil(Math.random() * 15 + 1);
           var array = [];
           for(var i = 0 ; i < randomNum; i++){
               if((randomNum -2)===i ){
                   array.push({
                       text: 100
                   });
                   continue;
               }
               array.push(
                       {text: i}
               )
           }
           $scope.todoArray = array;

       }])
</script>