Hello!
I have this html
<body ng-controller="AppCtrl">
<ion-side-menus>
<ion-side-menu-content>
<ion-nav-bar class="nav-title-slide-ios7 bar-positive">
<ion-nav-back-button class="button-icon ion-arrow-left-c">
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" ng-click="toggleLeft()">
</button>
</ion-nav-buttons>
<ion-nav-view animation="slide-left-right" name="main-view"></ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<div class="list">
<a menu-close href="#" class="item item-icon-left">
<i class="icon ion-home"></i>
Home
</a>
<a menu-close href="#/product" class="item item-icon-left">
<i class="icon ion-home"></i>
products
</a>
<a menu-close href="#/category" class="item item-icon-left">
<i class="icon ion-home"></i>
Category
</a>
</div>
</ion-side-menu>
</ion-side-menus>
<script id="product.html" type="text/ng-template">
<ion-view title="products">
<ion-content>
<div class="list">
<a class="item" href="#/product-form?id={{item.id}}" ng-repeat="item in items | filter:{nome: searchText}">
{{item.nome}}
<span class="item-note">
{{item.quantidade}}
</span>
</a>
</div>
</ion-content>
<div class="tabs tabs-icon-top">
<a class="tab-item" href="#/product-form">
<i class="icon ion-home"></i>
Adicionar
</a>
<a class="tab-item" ng-click="openModal()">
<i class="icon ion-search"></i>
Filtrar
</a>
</div>
</ion-view>
</div>
</script>
<script id="search.html" type="text/ng-template">
<div class="bar bar-header item-input-inset">
<label class="item-input-wrapper">
<i class="icon ion-ios7-search placeholder-icon"></i>
<input type="search" placeholder="busca" ng-model="searchText">
</label>
<button class="button button-clear" ng-click="closeModal()">
cancelar
</button>
</div>
</script>
</body>
And with this controller
angular.module('ionicApp.controllers', ['ionicApp.config', 'xc.indexedDB'])
.controller('ProductController',function($scope, $ionicPopup, $timeout, $ionicModal, $indexedDB, $window, $ionicModal){
$scope.safeApply = function(fn) {
var phase = this.$root.$$phase;
if(phase == '$apply' || phase == '$digest') {
if(fn && (typeof(fn) === 'function')) {
fn();
}
} else {
this.$apply(fn);
}
};
var OBJECT_STORE_NAME = constants.productStore;
$scope.items = [];
$scope.searchText = "";
$scope.getAll = function(){
var myObjectStore = $indexedDB.objectStore(OBJECT_STORE_NAME);
myObjectStore.getAll().then(function(results) {
// Update scope
$scope.safeApply(function(){
$scope.items = results;
});
});
};
$scope.getAll();
$ionicModal.fromTemplateUrl('search.html', {
scope: $scope,
animation: 'slide-left-right'
}).then(function(modal) {
$scope.modal = modal;
});
$scope.closeModal = function() {
alert($scope.searchText);
$scope.modal.hide();
};
$scope.openModal = function() {
//$scope.searchText = "a";
$scope.getAll();
$scope.modal.show();
};
$scope.closeModal = function() {
alert($scope.searchText);
$scope.modal.hide();
};
//Cleanup the modal when we're done with it!
$scope.$on('$destroy', function() {
$scope.modal.remove();
});
// Execute action on hide modal
$scope.$on('modal.hidden', function() {
// Execute action
});
// Execute action on remove modal
$scope.$on('modal.removed', function() {
// Execute action
});
})
My problem is the searchText model isnt updating when the value changes. I tried $watch, ng-options.
I can put a initial value to the $scope.searchText on openModal method, but after inputed values dont update the model value, because of this my list isnt filtred.
Anyone could help me?
Thanks.