ng-repeat stuck in infinite loop angularfire 8.2

问题

I'd like to figure out why this ng-repeat statement runs infinite. Item.members has a length of 2 and contains userIds = true

<script type="text/ng-template" id="items_renderer.html">
     <label>
       <span class="team-description" ng-show="!item.editing">{{item.name}}</span>

       <label ng-repeat="memberId in item.members">
         <span>{{ getMember(memberId) }}</span>
       </label>
     </label>
</script>


 <div ui-tree="options" class="teamlist">
     <ol ui-tree-nodes ng-model="teams" class="panel-teams">
         <li ui-tree-node ui-tree-handle
          ng-repeat="item in teams"
          ng-include="'items_renderer.html'">
         </li>
     </ol>
 </div>

$scope.getMember = (memberId) ->
  memberobj = fbutil.syncObject('users/' + memberId)
  memberobj.$loaded().then (ref) ->
    $scope.teamUser.push ref.name
    console.log $scope.teamUser
    return $scope.teamUser

It will just keep running indefinite.

["Sven Woldt", "Sven Woldt", "Sven Woldt", "Sven Woldt", "Sven Woldt", "Sven Woldt", "Sven Woldt", "Sven Woldt", "Sven Woldt", "Yahoo", "Yahoo", "Yahoo", "Yahoo", "Yahoo", "Yahoo", "Yahoo", "Yahoo", "Yahoo", "Sven Woldt", "Yahoo", "Sven Woldt", "Yahoo", "Sven Woldt", "Yahoo",…]

So how could I restrict this to only return ["Sven Woldt", "Yahoo"]

Thanks for your help!

回答1:

It is indefinite because you keep pushing to $scope.teamUser in your $scope.getMember function. If you simply want to display name, why not try

$scope.getMember = (memberId) ->
  memberobj = fbutil.syncObject('users/' + memberId)
  memberobj.$loaded().then (ref) ->
    return ref.name

回答2:

Every time Angular renders this <span>{{ getMember(memberId) }}</span> you end up (re)loading that member from Firebase, which in turn triggers a re-render.

Your flow is like this:

Angular starts to render your view
Angular calls getMember
getMember starts loading the data from Firebase
At some point the data is loaded and your then is executed
You push a new object onto the $scope, which in turn
Tells Angular to re-render your view, so we go back to step 1

Your getMember code should check if it has already loaded this member before. If it did, it shouldn't try to reload it - or at least not push it into the $scope again.

来源：https://stackoverflow.com/questions/27016649/ng-repeat-stuck-in-infinite-loop-angularfire-8-2

标签

angularjs

firebase

angularfire