Angular-Isotope Example track by

Mark Allen Hall - Mankind Software

Selector-Based Filter

Selector and Value-Based Sort

Scripted Change

ng-repeat with track by and orderBy

  • ...
    • {{x.name}}
      {{x.date | date}}
      {{x.number}}

    Use ng-repeat with "track by"

    Angular Saves and Restores Isotope's Model

    In the newer vesions of Angular, elements are reused if you use the "ng-repeat / track by" combination. If the original model reappears, Angular will assign the original DOM element back to it. Additionally, a new element added to the original array will be indicated as $last=true, which makes Angular-Isotope do an automatic refresh.

    • {{x.name}}
      {{x.date | date}}
      {{x.number}}

    The original element is identified by the "track by" key name, such as "name" or "date". This is not a true, hashed-object comparison. If an object has the same key as an earlier object, the corresponding DOM element will be attached to it.

    Using "track by" in ng-repeat

    • {{x.name}}
      {{x.date | date}}
      {{x.number}}

    xList

    Live view of this demo's array.

    {{xList}}