2016-08-14 2 views
0

Уверен, что этот вопрос уже задан раньше, но я не мог его найти или найти, поэтому я хотел бы задать тот же вопрос и откройте поток для более четких ответов с некоторыми примерами.Как вызвать другую функцию в ng-repeat в Angular

Моя цель - отобразить команды и их рейтинг, примечание: для отображения ранжирования у меня есть отдельная функция, которая получает рейтинг команды в зависимости от поля их оценки в дБ.

У меня есть две функции в TeamController, как показано ниже:

 tm.showAllByClass = function (classId) { 
      TeamService.showAllByClass(classId).then(function (response) { 
       tm.teamsInClass = response.data; 
      }).catch(function (error) { 
       $scope.result = error; 
      }); 
     }; 

     tm.ranking = function (classId, teamId) { 
      TeamService.ranking(classId, teamId).then(function (response) { 
       return response.data; 
      }).catch(function (error) { 
       $scope.result = error; 
      }); 
     }; 

     <tr ng-repeat="tm in team.teamsInClass.data"> 
       <td>{{tm.group_number}}</td> 
       <td>{{tm.role.name}}</td> 
       <td>{{tm.ranking(tm.class_id, tm.id)}}</td> 
       <td>{{tm.amount | currency}}</td> 
     </tr> 

И это функция в серверной части, которая получает все команды:

public function findAllTeamsInClass($classId) 
{ 
    return Team::where('class_id', '=', $classId)->with('role', 'business')->get(); 
} 

// return rank of team 
public function teamRanking($classId, $teamId){ 
    return 3; // for sake of simplicity I just return a static value 
} 

Есть ли способ, что я могу прикрепить функцию teamRanking прямо в команду entitiy как отношения или что-то еще?

По какой-то причине tm.ranking() ничего не возвращает, как я могу вызвать функцию, возвращающую значение в ng-repeat.

+0

Обязательно сделайте запрос '$ http' * * внутри' ngRepeat', это действительно плохая практика. Кроме того, я сомневаюсь, что вы не получите ошибку, например, 'бесконечный дайджест' или что-то вроде этого. – developer033

+0

@ developer033, я полностью согласен с вами, и у меня не было выбора сделать это, не могли бы вы рассказать мне, что является другим способом или лучший способ справиться с такими случаями? – artan

+0

Я был бы очень признателен за вашу помощь в этом, поскольку для меня очень важно понять, как с этим справиться ... было бы еще больше, если бы вы могли объяснить это несколькими примерами. – artan

ответ

0

Поскольку выбор отдельных рейтингов является асинхронным, эти операции должны быть прикованным из списка списка команд.

team.showAllByClass = function (classId) { 
    TeamService.showAllByClass(classId).then(function (response) { 
     team.teamsInClass = response.data; 
     //return for chaining 
     return team.teamsInClass; 
    }).then(function(teamsInClass) { 
     promiseArray = []; 
     for (var iTeam=0; iTeam<teamsInClass.length; iTeam++) { 
      //IIFE 
      (function (iTeam) { 
       var iPromise = TeamService.ranking(classId, iTeam.id); 
       iPromise = iPromise.then(function(response) { 
        var ranking = response.data; 
        team.teamsInClass[iTeam].ranking = ranking; 
        return ranking; 
       }); 
       promiseArray.push(iPromise); 
      })(iTeam); 
      //end IIFE 
     }; 
     //return for chaining 
     return $q.all(promiseArray); 
    }).then(function(rankingArray) { 
     console.log("All rankings fetched");   
    }).catch(function (error) { 
     $scope.result = error; 
    }); 
}; 

Приведенный выше пример выбирает список команд, а затем создает список обещаний, которые прикрепляются каждый рейтинг каждой команды. Он использует $q.all до цепь список обещаний.

HTML-

<tr ng-repeat="tm in team.teamsInClass"> 
      <td>{{tm.group_number}}</td> 
      <td>{{tm.role.name}}</td> 
      <td>{{tm.ranking || 'PENDING' }}</td> 
      <td>{{tm.amount | currency}}</td> 
    </tr> 

Ранжирование будет отображаться как PENDING, пока данные не будут извлечены из API.

+0

Я сделал то же самое, только что сделал это со стороны сервера ... Я буду принимать это как правильный asnwer :) – artan

0

Вы могли бы иметь один и тот же ответ здесь: https://stackoverflow.com/a/26400951/6715875

вы можете просто вызвать функцию внутри нг-повтора так же, как нормальный.

+0

это не работает для меня! – artan

+0

Я пробовал это раньше, все было в порядке. Можете ли вы показать мне, что дело не работает? –

Смежные вопросы