javascriptangularjsangularngfor

Angular 2: Callback when ngFor has finished

In Angular 1 I have written a custom directive ("repeater-ready") to use with ng-repeat to invoke a callback method when the iteration has been completed:

if ($scope.$last === true)
{
    $timeout(() =>
    {
        $scope.$parent.$parent.$eval(someCallbackMethod);
    });
}

Usage in markup:

<li ng-repeat="item in vm.Items track by item.Identifier"
    repeater-ready="vm.CallThisWhenNgRepeatHasFinished()">

How can I achieve a similar functionality with ngFor in Angular 2?

Solution

  • You can use something like this (ngFor local variables):

    <li *ngFor="#item in Items; #last = last" [ready]="last ? false : true">

    Then you can Intercept input property changes with a setter

      @Input()
  set ready(isReady: boolean) {
    if (isReady) someCallbackMethod();
  }