Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ListView rendering bug on 1.2.0 aswell as @next

See original GitHub issue

We experience some very odd rendering issues with ListViews in the lastest next version of nativescript-angular (all 1.3.0-2016 untill at least 1.3.0-2016-11-30-1112).

I’ve recorded a demo video here: https://github.com/m-abs/angular2-seed-advanced/blob/ng2-list-view-bug/bug-video.mkv?raw=true

As you can see in the video:

I’ve a small ListView (at the bottom of the HomeComponent) each item have a title and one of the items have a now_playing-icon to the right.
I navigate to another page.
And click the back-button, so I end up at the first page again.
When I click back to the first page.* Now the ListView is suddenly just the icon.

The template can be seen here: https://github.com/m-abs/angular2-seed-advanced/blob/ng2-list-view-bug/src/client/app/components/home/home.component.tns.html#L17-L24 The data for the listview can be seen here: https://github.com/m-abs/angular2-seed-advanced/blob/ng2-list-view-bug/src/client/app/components/home/home.component.ts#L30-L50

I think it happens because there is an element with *ngIf under the ListView-template. It seems that the first element with *ngIf gets rendered as the whole item-view, even if the truthiness value is false. In my example I used an Image-element, but if I replace it with a Label, the Label is rendered on all the ListView-items. and if I add two elements only the first of them is rendered. Regardless of the *ngIf value.

Whole demo project is here: https://github.com/m-abs/angular2-seed-advanced/tree/ng2-list-view-bug

Issue Analytics

State:
Created 7 years ago
Reactions:1
Comments:8 (6 by maintainers)

Top GitHub Comments

1reaction

m-abscommented, Dec 15, 2016

If you move the item content template to its own component the problem should go away. That’s how we got around it.

The problem should be fixed (they closed my issue with a pull request), but it haven’t been released yet, so for now try moving it to a separate component.

1reaction

m-abscommented, Dec 4, 2016

I think, I’ve found a workaround: https://github.com/m-abs/ns-debugging/blob/ng2-list-view/app/home/home.component.html#L13-L17 https://github.com/m-abs/ns-debugging/blob/ng2-list-view/app/home/home.component.ts#L13-L44

Moving ListView items into a separate ItemComponent seems to solve the problem.