AngularJS Progress Simulation

Directive demonstrating that the parent controller is performing some "simulated" operations and changing the progress status of 3 potentially different operations. Directive is actively reporting on the progress of each operation.

HTML

<div ng-app="app" ng-controller="testCtrl">
    <test-direct ng-repeat="obj in group track by $index" name="{{obj.name}}" progress="obj.progress"></test-direct>
    <div>
    <button type='button' ng-click="paynetMerchant(27)">ОТМЕНА</button>
                   
    <P>
    
    {{merchantId}}
    </P>
    </div>
</div>

CSS

.card {
    width: 25%;
    border: 1px solid #999;
    padding: 5px;
    margin: 5px;
    float: left;
    text-align: center;
}
small {
    color: #ccc;
}

JavaScript

var app = angular.module('app',[]);

app.controller('testCtrl',function($scope,$interval){
    $scope.group = [
        {
            name: 'Test One',
            progress: 0,
        },
        {
            name: 'Test Two',
            progress: 0,
        },
        {
            name: 'Test Three',
            progress: 0,
        }
    ];
   
    $scope.paynetMerchant = function(num){
     for (var k = 0; k < $scope.paynetMenus.services.length; k++) {
                        if ($scope.paynetMenus.services[k].type == "pay") {
                            if ($scope.paynetMenus.services[k].id == num) {
                                var pay_service = $scope.paynetMenus.services[k].merchant_id;
                                $scope.merchantId= pay_service;
                                alert(pay_service);
                               
                            }
                        }
                    }
                    
                     $scope.paynetMenus = {
        "categories": [
            {
                "id": 1,
                "name": "Сотовые операторы",
                "titleKey": {
                    "en": "Mobile operators",
                    "ru": "Мобилный операторы",
                    "uz": "Mobil Operatorlar"
                },
                "parent_id": 0,
                "active": 1,
                "script": "getNextMenus(1)"
            },
            {
                "id": 2,
                "name": "Kommunal",
                "titleKey": {
                    "en": "Communal payment",
                    "ru": "Коммунальный",
                    "uz": "Kommunal to`lovlar"
                },
                "parent_id": 0,
                "active": 1,
                "script": "getNextMenus(2)"
            },
            {
                "id": 6,
                "name": "Электроэнергия",
                "titleKey": {
                    "en": "Electric energy",
                    "ru": "Электроэнергия",
 ...