Angular condition slicepipe in a ngfor [duplicate]

Question

I want to know how can I use an conditional slicepipe in an ngFor to control the data displayed ?

For example to choose the number of videos displayed on a list/grid for example like these commons dropdowns :

What I'm trying to do now is:

<app-example
      class="items-list-item"
      *ngFor="let item of datas.video | slice:0:1"
      [itemvideo]='item'>
</app-example>

But how I can do this dynamically when I change the value on the select dropdown ?

Answer 1

You just need to define the variable and assign those values

 start : number = 1;
 end : number = 5;

then change it according to the dropdown value

this.end = yourdropdownval;

and the ngFor will look like,

<app-example class="items-list-item" *ngFor="let item of datas.video  | slice:start:end'>