uttesh / ionic-letteravatar

letter avatar for the ionic application, its replica of previous directive "ngletteravatar" slightly modified for the ionic framework
http://uttesh.github.io/ionic-letteravatar
MIT License
17 stars 10 forks source link

Adding filter to the list will not work or any other changes to the list. #1

Open Jinoooo opened 9 years ago

Jinoooo commented 9 years ago

If a filter added to the list, the filtered list won't have the correct avatar, but the old avatar based on the previous $index. tried to $observe the attribute for change and re-generate the imageTag, with no luck. If needed I can create a pen for demo.

uttesh commented 9 years ago

@Jinoooo yes could you please create pen it will be use to debug

Jinoooo commented 9 years ago

Here is the pen. http://codepen.io/Jinooo/pen/wKYZZq/?editors=101 If you search for James, avatar shows: WI (the previous ion-item at index 0 for William). I noticed it happens only if you add track by $index to the ng-repeat directive.

uttesh commented 9 years ago

@Jinoooo thanks for codepen. gone through the issue looks like its the compiler issue on directive i.e. on data filed value changes directive need to be re-compiled to update the isolated scope. is this issue is blocking? re-compiling the directive on each data change will not be good idea anyway i will do more research on how to resolve. for your reference see similar thread in angularjs forum https://github.com/angular/angular.js/issues/7119

Jinoooo commented 9 years ago

Not sure how the other directive are handing this scenario very nicely, like ng-repeat. This is an expected behaviour from any directive to react upon change. The interesting part is the fact that if you remove the track by $index, it works just fine, which is puzzling. i.e why it reacts with changes without being re-compiled !?

uttesh commented 9 years ago

track by $index is having issue. track by user.name works perfectly i.e

track by clause is introduced in 1.2x version for duplicate index values as well performance and track by wont re-compile the scope, It allows you to specify your own key for ngRepeat to identify objects by, instead of just generating unique IDs, means id will remain same in original object and the updated ones – ngRepeat will know not to recreate the DOM elements and reuse them.