CODEWITHSUNDEEP
javascriptangularjsdata-bindingionic-framework
Sergio Lenoir
Sergio Lenoir

Reputation: 53

Updating controller data doesnt update the view - Angular JS - Ionic

I have this controller :

.controller("mainctrl",function($scope,$state){
        var self = this;

        var usuario = window.localStorage.getItem('usuario');
        this.msjs=[];

        var res = window.localStorage.getItem(usuario+'_msjs');
        if(res===null)
        {
            this.msjs=[];
        }
        else{
            this.msjs=JSON.parse(res);
        }

        $scope.$on('newMessageReceived', function(e, msg) {
            //alert('message received:'+msg);
            self.msjs.push(msg);
            alert('mensaje recibido');
            alert(JSON.stringify(self.msjs));

            window.localStorage.setItem(usuario+'_msjs',JSON.stringify(self.msjs));
            $state.reload();

        });
  }

And the view:

<ion-view ng-controller="mainctrl as m" >
             <ion-nav-buttons side="right">
                 <button class="button" ng-click="m.logout()">Logout</button>
             </ion-nav-buttons>
             <ion-content id="msjcontent">
                 <h1 class="button-positive" id="log">Mensajes</h1>
                 <div class='card' ng-repeat="msj in m.msjs track by $id($index)">
                     {{msj}}
                 </div>

             </ion-content>
</ion-view>

When the $scope receives the event it pushes a new element in the 'msjs' array. The view doesnt update the data. I had to put $state.reload() to refresh the $state (ui-router from Angular-Ionic) and watch the changes. This refresh is giving me problems such as multiple copies of $scopes (1 for each $state.reload() ). i've already tried with $scope.apply() and it didnt work. I think the problem may be Ionic/angular ui-router stuff.

I want to know a better way to bind the msjs array to the view without refresh the $state.

Thanks.

Upvotes: 2

Views: 2639

Answers (2)

Mohammed BOUTCHEKKOUCHT
Mohammed BOUTCHEKKOUCHT

Reputation: 57

.state(url: '/url', controller: Ctl, templateUrl: 'template.html', cache: false)
cache: false ==> solved my problem ^^

Upvotes: 0

Sergio Lenoir
Sergio Lenoir

Reputation: 53

I was writing $scope.apply() and the correct method is $scope.$apply().

Upvotes: 1

Related Questions