2016-04-01 18 views
0

Açısal uygulamamın ana oturum açma sayfasında bir kullanıcı geçersiz bir kullanıcı adı/parola birleşimi girmeye çalıştığında bir hata iletisi görüntülemeye çalışıyorum. Bazı sebeplerden dolayı, ng-show hata mesajı sadece tarayıcımdaki açık sayfadan anlık olarak uzaklaşıp sonra geri dönersem gösterecektir. Mesela geçersiz bir kullanıcı adı/parola çifti ile gönderdiğime karar verdikten sonra, ben (ya da başka bir açık program) yüceliğe geçiş yapana kadar bir şey olmayacak ve geri döneceğim. Sorun, giriş denetleyicisinde yatıyor sanıyorum ama emin değilim. İletinin, giriş formunun başarısız bir gönderiminde hemen görüntülenmesini istiyorum. Bu böcek tarafından oldukça şaşırdım ve herhangi bir yardım büyük takdir edilecektir.açısal ng-show yalnızca pencereye geri döndüğümde çalışır

bakınız aşağıdaki ilgili kodu:

login.controller.js ben bu sorunu çözdü

(function() { 
    'use strict'; 

    angular 
     .module('app.login') 
     .controller('LoginFormController', LoginFormController); 

    LoginFormController.$inject = [ 'envService', '$http', '$state', 'ngParse', 'toaster', '$rootScope','AclService']; 
    function LoginFormController(envService, $http, $state, ngParse, toaster, $rootScope, AclService) { 
     var vm = this; 

     activate(); 

     //////////////// 

     function activate() { 

      // bind all data from the form 
      vm.account = {}; 
      vm.authMsg = ''; 
      vm.login = function() { 
      vm.authMsg= ''; 
      AclService.flushRoles(); 


       ngParse.User.logIn(vm.account.email,vm.account.password, { 

         success: function(user) { 
         var resp = new ngParse.Query(ngParse.Role).equalTo("users", ngParse.User.current()).find().then(function(results){ 
          if(results.length > 1){ 
          results.forEach(function(el){ 
           AclService.attachRole(el.attributes.name); 
          }) 
          }else{ 
          AclService.attachRole(results[0].attributes.name) 
          } 

         // After the role has been attached to user, THEN go to the next state 
         }) 
         .then(function(){ 
          // console.log("EMAIL:", vm.account.email); 
          // console.log("Pass:", vm.account.password); 
         $state.go('appNoSidebar.home'); 
         }) 
         }, 
         error: function() { 

         vm.authMsg = 'Incorrect credentials. Please try again!'; 
         } 

       }); 
      }; //end login 
     } // end activate 
    } // end controller 
})(); 

login.jade

.block-center.mt-xl.wd-xl 
    // START panel 
    .panel.panel-dark.panel-flat 
    .panel-heading.text-center 
     a(href="#") 
     img.block-center.img-rounded(src='app/img/carePortalLogo.png', alt='Image') 
    .panel-body 
     p.text-center.pv SIGN IN TO CONTINUE. 
     form(role='form', ng-submit="login.login()", name='login.loginForm', novalidate='').mb-lg 
     .form-group.has-feedback 
      input#exampleInputEmail1.form-control(type='email', name="account_email" placeholder='Enter email', ng-model="login.account.email", required='') 
      span.fa.fa-envelope.form-control-feedback.text-muted.loginIcon 
      span.text-danger(ng-show="login.loginForm.account_email.$dirty && login.loginForm.account_email.$error.required") This field is required 
      span.text-danger(ng-show="login.loginForm.account_email.$dirty && login.loginForm.account_email.$error.email") This field must be a valid email address 
     .form-group.has-feedback 
      input#exampleInputPassword1.form-control(type='password', name="account_password" placeholder='Password', ng-model="login.account.password", required='') 
      span.fa.fa-lock.form-control-feedback.text-muted.loginIcon 
      span.text-danger(ng-show="login.loginForm.account_password.$dirty && login.loginForm.account_password.$error.required") This field is required 


     button.btn.btn-block.btn-primary.mt-lg(type='submit') Login 

     .alert.alert-danger.text-center(ng-show='login.authMsg') {{login.authMsg}} 
    // END panel 

rota

.state('appNoSidebar.login', { 
     url: '/login', 
     templateUrl: helper.basepath('login.html'), 
     resolve: helper.resolveFor('modernizr', 'icons', 'toaster'), 
     controller: 'LoginFormController', 
     controllerAs: 'login' 
     }) 

cevap

0

vm.authMs sarma vm.authMsg öğesini şu şekilde bağlamak için $ scope.apply cinsinden g: bu şekilde kapsamı:

$scope.$apply(function(){ 
    vm.authMsg = 'Access Denied'; 
});