2016-08-10 2 views
0

ホームページにログインポップアップとパスワードリセットポップアップがあります。私はログインの送信をクリックすると、成功した後、私は成功コールバックでユーザーapiの要求を呼び出しているので、私はhtmlテンプレートでユーザー名を読み込むので、私はログイン成功後のテンプレートでユーザーの詳細を取得しますリセットパスワードのポップアップ。
パスワードをリセットするポップアップには、パスワードを正常にリセットした後にログインボタンがあります。ログインボタンをクリックした後、私は成功を収めています、成功コールバック内のconsole.logがコンソールに表示されています。私は成功のためにユーザーapiの要求を呼び出すので、私はまた、console.logでユーザーの詳細を取得しています。しかし、ユーザーの詳細はHTMLテンプレートに読み込まれていません。しかし、ページをリロードした後、私はhtmlテンプレートでユーザーの詳細を取得しています。私はユーザーの詳細を取得していますが、ログインポップアップに直接ロードする必要はありません。パスワードをリセットしてログインしたときは表示されません。
私は私がちょうどResetPasswordのテンプレートとログインテンプレートを渡していたパラメータのテンプレートを通じて、この
anglejsのhtmlテンプレートにスコープデータがロードされていません

.state('resetPassword', { 
       url: '/home/reset_password', 
       templateUrl: 'home/home.html', 
       controller: 'HomeController', 
       controllerAs: 'vm', 
       data: { 
        requireLogin: false 
       } 
      }) 
      // UI Router Login 
      .state('login', { 
       url: '/login', 
       templateUrl: 'login/uirouterlogin.html', 
       controllerAs: 'vm', 
       data: { 
        requireLogin: false 
       } 
      }) 

コントローラコード

のようにルーティングしています。どのボタンがクリックされたかに基づいています。

$scope.showLogin = function(e, template) { 
     console.log(template); 
     var modalInstance = $uibModal.open({ 
      animation: true, 
      templateUrl: 'login/' + template + '.html', 
      'controllerAs': 'login', 
      controller: function($uibModalInstance, $scope, logIn) { 
       $scope.modalClose = function() { 
        $uibModalInstance.dismiss('Close'); 
       }; 
       $scope.loginUser = function(existinguser) { 
        $scope.loginLoading = true; 
        logIn.getlogIn(existinguser) 
         .then(function(success) { 
          $state.reload(); 
          $uibModalInstance.dismiss('Close'); 
          getApi(); //to get the user details. 

          cartReload(); 
          $scope.loginLoading = false; 
          console.log(success.data); 
          $login.getLoginRedirect(); 
          $authentication.setAuthKey("key"); 
          $scope.loginupError = false; 
         }, function(error) { 
          $scope.loginLoading = false; 
          console.log("Login Failed"); 
          $scope.loginError = true; 
          if (error.data) { 
           $scope.loginErrorMsg = error.data.message; 
          } else { 
           $scope.loginErrorMsg = "Error connection, Please try again"; 
          } 
          $timeout(function() { 
           $scope.loginError = false; 
          }, 4000); 
         }) 
       }; 

*リセットパスワードのポップアップ意志が、私はこのようにやっていることポップアップを取得するには、ページの読み込み に表示されます*

$rootScope.$on('$stateChangeSuccess', 
     function(event, toState, toParams, fromState, fromParams) { 
      if (toState.name === 'resetPassword') { 
       $scope.showLogin('$event', 'resetpassword'); 
      } 
      $scope.home_state = toState.name; 
     } 
    ) 

HTML

<li ng-if="!user"><a ng-click="showLogin($event,'login')">LOGIN</a></li> 
<li ng-if="user">user.name</li> 

答えて

-1

あなたは成功を割り当てていません.dataを$ scopeに追加します。私はあなたのコードは次のようにあるべきだと思う - コントローラー:

$scope.UserData = success.data; 

、ビュー/ HTML形式から:

<li ng-if="!UserData.user"><a ng-click="showLogin($event,'login')">LOGIN</a></li> 
<li ng-if="UserData.user">{{UserData.user.name}}</li> 
+0

問題ではない、私は成功データを割り当てています、私は、ユーザーの詳細情報を取得しています、ホームページの直接ログインポップアップではなく、リセットパスワード - >ログイン成功後、私は同じ機能を使用しています。関数なし – codelearner

+0

さて、空のユーザーモデルを定義してください。ログインに成功したら、そのモデルにuserdataをプッシュし、それをビューにバインドします。このアプローチには、ほとんどすべての優れた開発者が従います。 –

関連する問題