Li list show shuffle on page


#1

Hello, i have a question about array list.
i have product list and products are shown in reverse order by product id.

<ion-item-group *ngIf=“timeList” no-lines>

    <ul style="display:inline-block;">

        <ng-template ngFor let-prod [ngForOf]="timeList">

            <li  *ngIf="(prod.timeType == 0 && !prod.hide) || (prod.timeType == 1 && prod.rnCount > 0)  || prod.timeType == 2" style="float:left; width:100%">
            </li>
         </ng-template>
      </ul>

My question is that “How can my products are shown shuffle on page?”
Anyone knows how to do this?

Please help me to solve this question.
Thanks.


#2

Hello,

shuffle like mixing poker cards? Sorry for my english.

You should create an array that holds only that data you need.

This array can shuffeld by implementing an self coded shuffle algorythmus or you use a helper like https://underscorejs.org/#shuffle or https://lodash.com/docs/4.17.10#shuffle or …

Best regards, anna.liebt


#3

Thank you for your reply.
I’ve seen your reply and tried this “.shuffle(collection)".
But i don’t know how to use "
.shuffle(collection)” on *.ts
this “__.shuffle(collection)” is *.js .
so please anyone knows how can i use on *.ts

Thank you.


#4

hello,

I am not sure, if I understood you wright. ts is transpilled into js. So there should no problem.

Have you installed underscore probablly?.

Install it at command window with:
npm i underscore --save
Get get more help from ide install the types like:
npm i @types/underscore --save
Next thing is to import in *.ts file where you want to use it like:
import _ from 'underscore';

now you should used it in your *.ts like:

let myshuffeldarray = _.shuffle(myarray);

Hope it is not faulty, maybe someone who use it actually could correct it.

Best regards, anna-liebt


#5

Don’t add a full library only for doing a shuffle.

Here is a simple example how to do that in your ts file

  shuffle(a) {
    let b, c, d;
    c = a.length;
    while (c) {
      b = Math.random() * c-- | 0;
      d = a[c];
      a[c] = a[b];
      a[b] = d;
    }
  }

this.shuffle(timeList);