Some Item's gap become 0 after replacing a list with a new value

[OrionStark]

The initial gap is 10. I have a list of items to show. I'm using *ngFor to show the item in ngx-glide. The list is not empty. Then, I try to replace the value in the list and expecting the ngx-glide to show the latest items. It did, but some of the first index to the third or fourth index gap became 0.

Is there something wrong with it? Is anyone have the same problem as me?

[avivharuzi]

Maybe it's a CSS problem that override the gap... Do you have a code example so I could look for this problem?

[OrionStark]

Well... I'm not sure if I was creating the same class as the ngx-glide classes. I'm just using it as usual.

[OrionStark]

Well, this is the complete description of how I got the problem.

in component.ts arrayList: string[] = ['2', 'fsafasdf', '3123weqw]; // Just an example

and in HTML inside the ngx-glide container. Just create a loop to show the slides according to the ArrayList.

after that, I try to navigate to another route and back again. When ngOninit being called, I'm fetching the new value from an API endpoint then replace the old value with it. Then it happens, the gap of the slides become 0.

[avivharuzi]

Really weird there is a problem with a real library GlideJS I'm using with updated values... I mentioned this in the README description at the end. Basically, if the component destroyed and initialized again with the new values no need to be a problem... I will suggest trying to add If before ...:

<ng-container *ngIf="items && items.length > 0">
  <!-- start do draw the element -->
  <ngx-glide>...</ngx-glide>
</ng-container>

Sorry for the late response I hope it will help you.

[OrionStark]

@avivharuzi It's okay. Thanks for your help 👍 . I'll close this issue.