Setting collection-item-width dynamically


I was working on a project. Does anyone yet implemented ion-scroll with collection-repeat where collection-item-width can be changed on the fly ?

I am able to change the width of item. But scroll view doesn’t change ?


collection-item-width can handle a function.

For example:
I have a project with a custom grid layout (on tablets, handys, etc… the grid layouts via the device resolution using css media queries).

My controller has a method to get the container width and returns it. And this function is called by collection-item-width.


I am saying that I am able to change the collection-item-width but scrollview doesn’t change respectively. Please help me with it.


Are you triggering scrollview resize afterwards?

A codepen would be nice to understand your usecase


Yeah, Sure.

Take a look at this.


@andy @max any thought ?


Oh okay i think this is not build in, yet.

But you are right, if the ionic directives like$ionicListDelegate/
would have a refresh function, which triggers re-compiling the template.

One possible solution:

  • store the choosen value in a service
  • make a state.refresh
  • and get the value from the service for calculating