ListView image conflict when width and height is set

I’m using NativeScript with Angular. I have a list view that is rendering some json data. When I set the width and height property to my Image tag, it make some problem. Then when I scroll down, first it loads previous images, and then changes to the real images. (Without width and height, it works perfect, and when I scroll, first it’s blank, the the real images get loaded.)

Here is my code:

<ListView [items]="europianCountries" class="list-group">
    <ng-template let-country="item" let-i="index" let-odd="odd" let-even="even">
        <GridLayout class="list-group-item">
            <ListView.itemTemplate>
                    <Image width="100" height="100" stretch="aspectFill" id="item" (tap)="onItemTap($event)" (pinch)="onPinch($event)" [src]="'http://luxa.club/'+country.post_picture_time"></Image>
            </ListView.itemTemplate>
        </GridLayout>
    </ng-template>
</ListView>

Any idea?

[vahidvdn]

@tsonevn Also for my own issue, I changed my view and now it works fine:

<GridLayout rows="*">
    <ListView separatorColor="#d38008" [items]="europianCountries">
        <ng-template let-country="item" let-i="index" let-third="third">
            <StackLayout style="padding: 50px">
                <Image width="350" stretch="aspectFill" id="item" (tap)="onItemTap($event)" (pinch)="onPinch($event)" [src]="'http://luxa.club/'+country.post_picture_time"></Image>
                <Label [text]='country.post_description'></Label>
            </StackLayout>
        </ng-template>
    </ListView>
</GridLayout>

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.