Different behaviors on the view between a controller and a controller+Provider. (Ionic AngularJS)


#1

Hello,

I’m using ionic with cordova and I use controllers and services of AngularJS.

I did create (1) a controller which call the cordova plugin contacts.
I did create (2) a Provider (or a Factory) which call the cordova plugin contacts AND a controller which calls the related Provider (or Factory).

With the (1) I get my contact list in my view without any issues.

With the (2) I get the contacts (in console.log) but they don’t display on the screen phone.
I need to drag the screen with my finger (content of IonicMenu) myself to display the contact list.

How is that possible ? How can I display my list properly in my content view ?
Thank you for your help!!
Here is the (2) code :

App.controller('ListContactsCtrl', function($scope, $ionicPlatform, ContactsP, ContactsF) {

  $ionicPlatform.ready(function() {

    console.log('ListContactsCtrl platform ready');
    $scope.contacts = {};
    $scope.search = {};

    $scope.find = function() {
      console.log('ListContactsCtrl Find launched');
      $scope.contacts = new ContactsF($scope.search.txt);
      console.log($scope.contacts); // I get the contacrts properly but the view doesn't show them
      $scope.$apply();
     
    }

  })

});

the Ionic View

   <ion-view title="">
   <ion-nav-buttons side="left">
   <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
 </ion-nav-buttons>
 <ion-content has-header="true">

 <ion-list>
 <form ng-submit="find()">
   <ion-item type="item-text-wrap" can-swipe="true" option-buttons="itemButtons">
   <label class="item item-input">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="search" placeholder="Search" ng-model="search.txt" >
  </label>
</ion-item>
</form>

  <ion-item ng-repeat="contact in contacts.recherche" type="item-text-wrap" can-swipe="true" option-buttons="itemButtons">
            <h2>{{ contact.name.formatted }}</h2>
            <h3>{{ contact.phoneNumbers[0].value }}</h3>
          </ion-item>
        </ion-list>
      </ion-content>
    </ion-view>

#2

Questions:

  • Ionic Version?
  • Device Platform? iOS or Android?
  • Device Version, iOS 6, 7, Android 2.x? Android 4.x?
  • Cordova version?

this is the piece of code that concerns me:

$scope.contacts = new ContactsF($scope.search.txt);

Most Cordova functions are asynchronous. It does not look like you are waiting for a response or promise. Almost all calls to Cordova need to be via a promise or callback.


#3

Thank you very much Calendee.

Indeed I learned promise and it works very fine now.
I used promise and callback !