javascript - Angular js只会在ng-repeat中显示第一个元素

Question

我正在使用 angular 1.5.5

function GetDashboardForAllEmployees()
{
    var response = eRotaService.GetDashboard();
    response.then(function (data) {
        $scope.weekDays = data.data;
        console.log(data.data);

    }, function () {
        alert("Failed to load dashboard.");

    })
}

.NET 服务返回 json :

 {
    "weekDays": [{
        "name": "Monday",
        "display": 0,
        "employees": [{
            "employeeId": 1,
            "name": "Adam",
            "start": 8,
            "finish": 16,
            "gridSetup": {
            "sizeX": 8,
            "sizeY": 1,
            "row": 0,
            "col": 8
        }
    }, {
        "employeeId": 2,
        "name": "Paul",
        "start": 16,
        "finish": 22,
        "gridSetup": {
            "sizeX": 6,
            "sizeY": 1,
            "row": 0,
            "col": 16
        }
    }]
}, {
    "name": "Tuesday",
    "display": 1,
    "employees": [{
        "employeeId": 1,
        "name": "Bob",
        "start": 10,
        "finish": 18,
        "gridSetup": {
            "sizeX": 8,
            "sizeY": 1,
            "row": 0,
            "col": 10
        }
    }, {
        "employeeId": 2,
        "name": "Paul",
        "start": 16,
        "finish": 22,
        "gridSetup": {
            "sizeX": 6,
            "sizeY": 1,
            "row": 0,
            "col": 16
        }
    }]
}]

我打算显示一周中的每一天，但只有第一天(星期一)会显示。

 <div class="row" ng-repeat="week in weekDays">

    @for (int i = -2; i < 22; i+=2 )
    {
        <div class="col-sm-1">
            @string.Format("{0}:00", i + 2)
        </div>
    }
    <hr />
    <div class="col-sm-12">
        <h3>{{week[$index].name}}</h3>
        <hr />
        <div class="row" ng-repeat="employee in week[$index].employees">
            <div class="col-sm-12">
                <h4>{{employee.name}}</h4>
                <hr />

                <div gridster>
                    <ul>
                        <li gridster-item="employee.gridSetup"  ng-cloak>
                            <div class="panel-default" >
                                <div class="panel-heading">
                                    <h5>From : {{employee.start}} to {{employee.finish}}</h5> 
                                </div>

                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

</div>

我尝试在没有 $index 的情况下使用 ng-repeat，但结果是空白页(没有 Angular js 错误)。

Answer 1

<div class="row" ng-repeat="week in weekDays">

嗯，不应该是

<div class="row" ng-repeat="week in weekDays.weekDays">

Jason-String 看起来有点像这样格式化:

{
"weekDays": [
    {
        "name": "Monday",
        "display": 0,
        "employees": [
            {
                "employeeId": 1,
                "name": "Adam",
                "start": 8,
                "finish": 16,
                "gridSetup": {
                    "sizeX": 8,
                    "sizeY": 1,
                    "row": 0,
                    "col": 8
                }
            },
            {
                "employeeId": 2,
                "name": "Paul",
                "start": 16,
                "finish": 22,
                "gridSetup": {
                    "sizeX": 6,
                    "sizeY": 1,
                    "row": 0,
                    "col": 16
                }
            }
        ]
    },
    {
        "name": "Tuesday",
        "display": 1,
        "employees": [
            {
                "employeeId": 1,
                "name": "Bob",
                "start": 10,
                "finish": 18,
                "gridSetup": {
                    "sizeX": 8,
                    "sizeY": 1,
                    "row": 0,
                    "col": 10
                }
            },
            {
                "employeeId": 2,
                "name": "Paul",
                "start": 16,
                "finish": 22,
                "gridSetup": {
                    "sizeX": 6,
                    "sizeY": 1,
                    "row": 0,
                    "col": 16
                }
            }
        ]
    }
]
}

所以这意味着所有工作日都在元素“weekDays”中。然后你只有一周的时间，不需要数组索引器来访问漏洞。