Hi everyone,
I’m facing a weird issue when I try to apply an inline filter, on a list of items, inside a ion-content.
Here is a very simple code that show the problem :
<body ng-app='anApp'>
<div ng-controller='aCtrlr'>
<ion-content>
<label class="item item-input">
<i class="icon ion-search placeholder-icon"></i>
<input type="search" placeholder="Search" ng-model="roomTitle" ng-model-options="{debounce:200}">
</label>
<ul>
<li ng-repeat="room in rooms | filter:filterFunc">
{{room.name}}
</li>
</ul>
</ion-content>
</div>
And in my controller :
angular.module('anApp', ['ionic'])
.controller('aCtrlr', function($scope) {
$scope.rooms = [{name:'aaa', title:'ertert'},{name:'zzz', title:'yhth'},{name:'eeee', title:'rtyrty'},{name:'rrrr', title:'zerez'},{name:'ttttt', title:'dsf'}];
$scope.roomTitle = '';
$scope.filterFunc = function(item){
if($scope.roomTitle === '') return true;
return (item.name.indexOf($scope.roomTitle) !== 0);
};
})
Full code here : http://plnkr.co/edit/LoGmYHEoztxOgLTj4NlY
As long as my list is wrapped inside an ion-content the filter wont work. Actually the method is called but my $scope.roomTitle is never updated.
If I remove the everything is ok.
Is there something wrong the ion-content ? or am I missing something ?
Thank you,
G.