Winkelansicht wird nicht aktualisiert, wenn der Controller aktualisiert wurde

Question

Ich stoße auf ein Problem, bei dem eine Variable in meinem Controller aktualisiert wird, aber das Update wird nicht in der Ansicht angezeigt.

Die Variable, die auf dem Frontend angezeigt werden soll, ist loginErrorMessage, aber die Variable wird nicht angezeigt, wenn ich weg navigiere und dann zurück zu dieser Seite trotz der Aktualisierung in der Steuerung.

Unten finden Sie die Steuerung:

function LoginCtrl($rootScope, $state, $scope, UserService, AttributesService){ 
    var vm = this; 
    vm.loginErrorMessage = ''; 
    vm.email = ''; 
    vm.password = ''; 
    vm.doLogin = doLogin; 
    vm.successLoginJoinApiResponse = successLoginJoinApiResponse; 

    function doLogin(){ 
     if(UserService.validateLoginCredentials()){ 
     UserService.loginUser() 
     .success(function(response){ 
      vm.successLoginJoinApiResponse(response, false); 
     }) 
     }else{ 
     vm.loginErrorMessage = 'Incorrect Email or Password'; 
     console.log(vm.loginErrorMessage) 
     //vm.loginErrorMessage is updated at this point 
     } 
    } 

    function successLoginJoinApiResponse(response, join){ 
     // stuff happens here, not where the issue is. 
    } 
    } 

Hier ist die Route:

.state('app.login', { 
    url: '/login', 
    cache: false, 
    views: { 
     'menuContent': { 
     templateUrl: 'templates/login.html', 
     controller:'LoginCtrl as app' 
     } 
    }, 
    }) 

Und hier ist der Ansicht:

<ion-view view-title="" class=""> 
    <ion-nav-bar class="white-back"> 
    </ion-nav-bar> 
    <ion-content scroll="false" class="white-back has-header"> 

    // This is where the variable should be displayed 
    <div class="login-error-message" ng-bind="app.loginErrorMessage"> 
    </div> 

    <div class="center-everything mar-top-25"> 
     <form ng-submit="app.doLogin()"> 
     <div class="list pad-20 pad-top-30 pad-bottom-0"> 
      <label class="item item-input input-login"> 
      <input type="email" placeholder="Email" ng-model="app.email"> 
      </label> 
      <label class="item item-input mar-top-15 input-login"> 
      <input type="password" placeholder="Password" ng-model="app.password"> 
      </label> 
     </div> 
     <div class="pad-20 pad-top-0"> 
      <a class="link" ng-click="app.doLogin()"> 
      <button class="button button-block blue-back white" id="button-submit-stuff" type="submit"><b>LOGIN</b></button> 
      </a> 
     </div> 
     </form> 
    </div> 
    </ion-content> 
</ion-view> 

UserService.validateLoginCredentials() false zurückgibt und so Das Skript geht zur Else-Anweisung und irgendwo dort, wo es fehlschlägt.

Ich habe versucht, $ scope. $ Apply(), aber ich bekomme einen $ apply() bereits in Arbeit Fehler.

Ich habe auch bemerkt, dass die Variable nur für einen Moment erscheint, wenn ich von der Seite weg navigiere.

Ich bin auch dies durch Ionic ausgeführt.

Wenn jemand einen Rat hat, würde ich es wirklich zu schätzen wissen, danke!

Answer 1

Nur eine Vermutung, aber in Ihrer DoLogin-Funktion ist die UserService.validateLoginCredentials() Methode async und gibt ein Versprechen? Denn in diesem Fall wird der Code im Else-Block niemals ausgeführt.

Answer 2

Also validieren Sie zuerst die Anmeldeinformationen und versuchen Sie dann, sich anzumelden?

Ich vermute, dass der UserService.loginUser den Teil von .error() fehlt.

function doLogin(){ 
    if(UserService.validateLoginCredentials()){ 
    UserService.loginUser() 
    .success(function(response){ 
     vm.successLoginJoinApiResponse(response, false); 
    }) 
    .error(function(err){ 
     vm.loginErrorMessage = 'Incorrect Email or Password'; 
     console.log(vm.loginErrorMessage) 
     //vm.loginErrorMessage is updated at this point 
    }); 
    } else{ 
    vm.loginErrorMessage = 'Incorrect Email or Password'; 
    console.log(vm.loginErrorMessage) 
    //vm.loginErrorMessage is updated at this point 
    } 
} 

Nur damit Sie wissen auch: Der Erfolg/Fehler Stenografie wird in Winkel 1,5 veraltet, aber man könnte dieses umschreiben:

function doLogin(){ 
    if(UserService.validateLoginCredentials()){ 
     UserService.loginUser() 
      .then(function(response){ 
       vm.successLoginJoinApiResponse(response, false); 
      }, 
      function(err){ 
       vm.loginErrorMessage = 'Incorrect Email or Password'; 
       console.log(vm.loginErrorMessage); 
       //vm.loginErrorMessage is updated at this point 
      }); 
    } else{ 
     vm.loginErrorMessage = 'Incorrect Email or Password'; 
     console.log(vm.loginErrorMessage); 
     //vm.loginErrorMessage is updated at this point 
     } 
    }