Question

以下是这种情况：我实际上正在我学校的一个项目上工作，今年夏天将有一些由一些教授组织的运动日。我实际上正在使用angularJS建立一个网站。

我的问题是我希望将球队放在每个单元格中，如果没有任何匹配，我想放置一个＆＃34; - ＆＃34;。例如，如果在09:00没有足球比赛，我会放一个＆＃34; - ＆＃34;在单元格中，我展示了其他单元格中的团队。我尝试直接在表达式测试中使用if测试，如果该项运动与标题中的运动相同，但是当比赛少于6时，球队不会被放入正确的单元格中。

我想到了一个解决方案，我找到了一个，使用循环，因为我知道最多有6个匹配，但我不知道如何在表达式中放置循环。如果你有更好的解决方案，我会很乐意尝试，如果我没有正确解释我的问题，我会尝试以更好的方式做到。

这是我的代码：

<table class="striped highlight">
    <thead class="light-blue darken-4">
    <tr>
        <th></th>
        <th>Ultimate</th>
        <th>Tchoukball</th>
        <th>Football</th>
        <th>Volleyball</th>
        <th>Handball</th>
        <th>Basketball</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="schedule in schedules track by $index">
        <td>{{schedule[0].HEURE_DEBUT_MAT}}</td>
        <td>{{schedule[$index].NOM_EQU1 == null ? "-" : schedule[$index].NOM_EQU1 + " vs " + schedule[$index].NOM_EQU2}}</td>
        <td>{{schedule[$index].NOM_EQU1 == null ? "-" : schedule[$index].NOM_EQU1 + " vs " + schedule[$index].NOM_EQU2}}</td>
        <td>{{schedule[$index].NOM_EQU1 == null ? "-" : schedule[$index].NOM_EQU1 + " vs " + schedule[$index].NOM_EQU2}}</td>
        <td>{{schedule[$index].NOM_EQU1 == null ? "-" : schedule[$index].NOM_EQU1 + " vs " + schedule[$index].NOM_EQU2}}</td>
        <td>{{schedule[$index].NOM_EQU1 == null ? "-" : schedule[$index].NOM_EQU1 + " vs " + schedule[$index].NOM_EQU2}}</td>
        <td>{{schedule[$index].NOM_EQU1 == null ? "-" : schedule[$index].NOM_EQU1 + " vs " + schedule[$index].NOM_EQU2}}</td>
    </tr>
    </tbody>
</table>

对于我的剧本：

// Contrôleur pour la page du planning
scheduleApp.controller('scheduleController', function($scope, $http){

    // Déclaration des variables
    var adress = "/api/";
    $scope.schedules = [{}];

    /**
     * Requête qui récupère le planning depuis la BD
     * pour remplir la table
     */
    $scope.getSchedules = function(){
        $http({method: 'GET', url: adress + 'planning/export/period'})
            .success(function(dataSchedules){
                // Stock les informations récupérées dans une array
                $scope.schedules = dataSchedules;
                console.log(dataSchedules);
            })
            .error(function(response){
                console.log("Erreur ", response);
                Materialize.toast("Erreur dans le chargement du classement du planning ! Erreur : " + response , 10000);
            });
    };
});

评论是法语，我所做的是从API获取数据并将这些数据放在一个对象数组中。数据格式如下： {

"0": [
    {
        "NOM_EQU1": "Les Schnitzels",
        "NOM_EQU2": "Les Patrons",
        "NOM_SPO": "Ultimate",
        "HEURE_DEBUT_MAT": "09:00"
    },
    {
        "NOM_EQU1": "La Confrérie",
        "NOM_EQU2": "Koh Lanta",
        "NOM_SPO": "Tchoukball",
        "HEURE_DEBUT_MAT": "09:00"
    },
    {
        "NOM_EQU1": "Green Sharks",
        "NOM_EQU2": "Les Keh à mojito",
        "NOM_SPO": "Football",
        "HEURE_DEBUT_MAT": "09:00"
    },
    {
        "NOM_EQU1": "Les Assistés",
        "NOM_EQU2": "Sur le terrain 8",
        "NOM_SPO": "Volleyball",
        "HEURE_DEBUT_MAT": "09:00"
    }

0表示一个句点，在0中有所有比赛在09:00播放，有25个句点。 NOM_EQU1和NOM_EQU2是球队名称，NOM_SPO是运动名称。

编辑：我试着解释一下我想做什么的例子。当我在单元格中时，我想测试数据NOM_SPO是否等于＆＃34;足球＆＃34;如果是我写在单元格＆＃34; team1 vs team2＆＃34;但如果不是我想跳到同一时期的第二个数组并尝试这个，我想要做到这一点，直到找到正确的数据。如果没有任何正确的数据我放了一个＆＃34; - ＆＃34;因为在此期间这项运动没有任何匹配。而且我想为每个细胞做到这一点，因为每个细胞都是一个不同的运动，我必须找到合适的团队才能把它放进去。

Answer 1

您可以尝试添加一个自定义功能，以便＆＃34;渲染＆＃34;您希望的数据。

 $scope.myvs = function(schedule) {
    if (schedule.NOM_EQU1 != null) {
      return schedule.NOM_EQU1 + " vs " + schedule.NOM_EQU2
    }
    return "-"
  }

然后在您的视图中重复使用它：

<td>{{myvs(schedule)}}</td>

而且：schedule[$index]错误，因为您已经使用ng-repeat在计划中进行了迭代：只使用schedule，您也可以用更简单的方式编写ng-repeat {{1} }

这是我的jsfiddle

我找不到一种更干净的方式来做，也许一个简单的ng-repeat="schedule in schedules"就像here一样，我宁愿做一个custom函数来处理它并写我的自己的公用事业服您应该查看ng-if，ng-switch，我相信您可以阅读this

希望有所帮助

angularJS循环到ng-repeat

1 个答案: