Using filter inside ionic modal

Hi guys!

i was trying to create a filter inside a ionic modal:

<div class="modal">
<ion-header class="bar bar-header bar-positive">
    <h1 class="title">Estados</h1>
    <a ng-click="closeStatesModal()" class="button button-outline button-light item-button-right" ><i class="ion-close"></i> Fechar</a>
</ion-header>
<ion-content has-header="true" has-padding="true" has-footer="true">
    Busca: <input type="text" ng-model="searchState.name">
    <div class="list">
        <ion-radio ng-repeat="state in states | filter:searchState" ng-hide="(state in states | filter:searchState).length == 0" ng-model="company.state_id" ng-change="selectState(state.name)" ng-value="state.id">{{state.name}}</ion-radio>
    </div>
</ion-content>

It works, but i got some bugs with the animation, the result slides down twice.
Has anyone been through this before?
Thanks!

1 Like

Can you set up a codepen or plunker?

Sure!
The problem appears only when i use the ion-radio.

Hmm, I think we may have got an issue here. I replaced the directive with just the plain mark up and it maybe an issue with the item-radio class. Basically when you remove that, you get the correct animation, but none of the correct style.

I’d open an issue on github and point to the codepen.

Thank you, i’ll do that.